Menu transparent dans indexhibit
Fermé
ttfrancisco
Messages postés
8
Date d'inscription
lundi 11 mai 2009
Statut
Membre
Dernière intervention
7 juin 2012
-
16 juin 2010 à 17:16
ttfrancisco Messages postés 8 Date d'inscription lundi 11 mai 2009 Statut Membre Dernière intervention 7 juin 2012 - 16 juin 2010 à 18:53
ttfrancisco Messages postés 8 Date d'inscription lundi 11 mai 2009 Statut Membre Dernière intervention 7 juin 2012 - 16 juin 2010 à 18:53
A voir également:
- Menu transparent dans indexhibit
- Menu déroulant excel - Guide
- Windows 11 menu démarrer classique - Guide
- Canon quick menu - Télécharger - Utilitaires
- Coeur transparent emoji ✓ - Forum Facebook
- Menu caché tv continental edison ✓ - Forum Téléviseurs
4 réponses
Krysstof
Messages postés
1483
Date d'inscription
mercredi 18 février 2009
Statut
Membre
Dernière intervention
23 août 2010
294
16 juin 2010 à 17:32
16 juin 2010 à 17:32
en fouillant 30 secondes dans le code la page
le CSS contient ca
ca me parait une bonne piste
le CSS contient ca
#menu {
width: 200px; /* sets the width of your left hand bar - if you change this also change the LEFT margin in #content to match */
overflow: auto;
top: 0;
bottom: 0;
left: 50px;
position: fixed; /* this make the menu stay in place while the content section scrolls*/
height: 100%;
background-color: #FFFFFF;
padding-top: 25px; /* change to match the padding-top in #content if you want them to align */
padding-bottom: 25px;
/* padding-left & right can be changed in #menu ul - below */
font-size: 11px;
opacity: 0.80;
ca me parait une bonne piste
avion-f16
Messages postés
19250
Date d'inscription
dimanche 17 février 2008
Statut
Contributeur
Dernière intervention
22 décembre 2024
4 505
16 juin 2010 à 17:34
16 juin 2010 à 17:34
Tu peux utiliser la propriété opacity ou les couleurs RGBa (c'est comme les RGB, sauf qu'on ajoute la couche "alpha" (transparence)) en CSS.
https://www.alsacreations.com/tuto/lire/909-CSS-transparence-couleur-rgba.html
http://www.quirksmode.org/css/opacity.html
https://www.alsacreations.com/tuto/lire/909-CSS-transparence-couleur-rgba.html
http://www.quirksmode.org/css/opacity.html
ttfrancisco
Messages postés
8
Date d'inscription
lundi 11 mai 2009
Statut
Membre
Dernière intervention
7 juin 2012
16 juin 2010 à 18:34
16 juin 2010 à 18:34
MERCI à vous j'ai pu avancer un peu! J'ai réussi à avoir le "filet" transparent à voir sur mon site: www.imagesin.ch .
Malheureusement je n'arrive pas à avoir l'image derrière le menu. Est le menu est trop bas aussi.
Voici le code de la page. Peut-être pouriez-vous me dire ce qu'il faut changer...MERCI
:/**
* CSS
*
* @version 1.0
* @author Vaska
* @author Gregory Cadar
*/
* {
margin: 0;
padding: 0;
}
body {
text-align: left;
font-size: 12px;
font-family: Helvetica, Arial, sans-serif;
background: #fff;
}
body.section-1 { }
body.section-2 { }
body.section-3 { }
#content a {
color: black;
text-decoration: none;
border-bottom: red solid 1px;
}
#content a:hover {
color: red;
border-bottom: red solid 1px;
}
img { border: none; }
.hide {
display: none;
}
#menu {
width: 215px;
overflow: auto;
top: 0;
bottom: 0;
left: 0;
position: fixed;
height: 100%;
background-color: rgba(255, 255, 255, 0.5);
font-weight: 100;
line-height: 120%;
paddingt: 20px;
margin: 20px;
}
#menu ul {
list-style: none;
margin: 0 0 12px 0;
}
#menu ul li.section-title { }
#menu a {
text-decoration: none;
color: #9d9d9d;
}
#menu a:hover {
text-decoration: none;
border-bottom: 1px red solid;
}
#menu .active a {
color: red;
}
#menu #menulink {
border-bottom: 1px white solid;
}
#content {
height: 100%;
margin: 0 0 0 225px;
padding-top: 57px;
top: 0;
text-align: left;
line-height: 120%;
}
.container {
padding: 5px 5px 25px 5px;
}
#content p { width: 600px; margin-bottom: 9px; }
p {
margin: 0 0 9px 0;
}
h1 { font-size: 32px; }
h2 { font-size: 24px; }
h3 { font-size: 16px; }
h4 { font-size: 12px; }
#img-container {
position: fixed;
top: 117px;
left: 230px;
margin: 0; padding: 0;
}
#img-container img {}
#img-container p.nav {
position: fixed;
top: 95px;
left: 230px;
margin: 0; padding: 0;
z-index: 100;
font-size: 10px;
}
#content #img-container a {
border: none;
}
#content #img-container a:hover {
color: red;
text-decoration: none;
}
/*
#img-container p { width: 400px; margin: 0; padding: 0 0 12px 0; }
*/
#once { clear: left; }
Malheureusement je n'arrive pas à avoir l'image derrière le menu. Est le menu est trop bas aussi.
Voici le code de la page. Peut-être pouriez-vous me dire ce qu'il faut changer...MERCI
:/**
* CSS
*
* @version 1.0
* @author Vaska
* @author Gregory Cadar
*/
* {
margin: 0;
padding: 0;
}
body {
text-align: left;
font-size: 12px;
font-family: Helvetica, Arial, sans-serif;
background: #fff;
}
body.section-1 { }
body.section-2 { }
body.section-3 { }
#content a {
color: black;
text-decoration: none;
border-bottom: red solid 1px;
}
#content a:hover {
color: red;
border-bottom: red solid 1px;
}
img { border: none; }
.hide {
display: none;
}
#menu {
width: 215px;
overflow: auto;
top: 0;
bottom: 0;
left: 0;
position: fixed;
height: 100%;
background-color: rgba(255, 255, 255, 0.5);
font-weight: 100;
line-height: 120%;
paddingt: 20px;
margin: 20px;
}
#menu ul {
list-style: none;
margin: 0 0 12px 0;
}
#menu ul li.section-title { }
#menu a {
text-decoration: none;
color: #9d9d9d;
}
#menu a:hover {
text-decoration: none;
border-bottom: 1px red solid;
}
#menu .active a {
color: red;
}
#menu #menulink {
border-bottom: 1px white solid;
}
#content {
height: 100%;
margin: 0 0 0 225px;
padding-top: 57px;
top: 0;
text-align: left;
line-height: 120%;
}
.container {
padding: 5px 5px 25px 5px;
}
#content p { width: 600px; margin-bottom: 9px; }
p {
margin: 0 0 9px 0;
}
h1 { font-size: 32px; }
h2 { font-size: 24px; }
h3 { font-size: 16px; }
h4 { font-size: 12px; }
#img-container {
position: fixed;
top: 117px;
left: 230px;
margin: 0; padding: 0;
}
#img-container img {}
#img-container p.nav {
position: fixed;
top: 95px;
left: 230px;
margin: 0; padding: 0;
z-index: 100;
font-size: 10px;
}
#content #img-container a {
border: none;
}
#content #img-container a:hover {
color: red;
text-decoration: none;
}
/*
#img-container p { width: 400px; margin: 0; padding: 0 0 12px 0; }
*/
#once { clear: left; }
ttfrancisco
Messages postés
8
Date d'inscription
lundi 11 mai 2009
Statut
Membre
Dernière intervention
7 juin 2012
16 juin 2010 à 18:53
16 juin 2010 à 18:53
MERCI. J'ai pu avancer un peu. J'ai réussit à avoir le "filet" transparent à voir sur mon site: www.imagesin.ch.
Malheureusement je n'arrive pas à avoir l'image derrière le menu. Ni à le remonter. Voici le code de la page, pouriez-vous s'il vous plait me dire ce qu'il faut changer. MERCI!!!
/**
* CSS
*
* @version 1.0
* @author Vaska
* @author Gregory Cadar
*/
* {
margin: 0;
padding: 0;
}
body {
text-align: left;
font-size: 12px;
font-family: Helvetica, Arial, sans-serif;
background: #fff;
}
body.section-1 { }
body.section-2 { }
body.section-3 { }
#content a {
color: black;
text-decoration: none;
border-bottom: red solid 1px;
}
#content a:hover {
color: red;
border-bottom: red solid 1px;
}
img { border: none; }
.hide {
display: none;
}
#menu {
width: 215px;
overflow: auto;
top: 0;
bottom: 0;
left: 0;
position: fixed;
height: 100%;
background-color: rgba(255, 255, 255, 0.5);
font-weight: 100;
line-height: 120%;
paddingt: 20px;
margin: 20px;
}
#menu ul {
list-style: none;
margin: 0 0 12px 0;
}
#menu ul li.section-title { }
#menu a {
text-decoration: none;
color: #9d9d9d;
}
#menu a:hover {
text-decoration: none;
border-bottom: 1px red solid;
}
#menu .active a {
color: red;
}
#menu #menulink {
border-bottom: 1px white solid;
}
#content {
height: 100%;
margin: 0 0 0 225px;
padding-top: 57px;
top: 0;
text-align: left;
line-height: 120%;
}
.container {
padding: 5px 5px 25px 5px;
}
#content p { width: 600px; margin-bottom: 9px; }
p {
margin: 0 0 9px 0;
}
h1 { font-size: 32px; }
h2 { font-size: 24px; }
h3 { font-size: 16px; }
h4 { font-size: 12px; }
#img-container {
position: fixed;
top: 117px;
left: 230px;
margin: 0; padding: 0;
}
#img-container img {}
#img-container p.nav {
position: fixed;
top: 95px;
left: 230px;
margin: 0; padding: 0;
z-index: 100;
font-size: 10px;
}
#content #img-container a {
border: none;
}
#content #img-container a:hover {
color: red;
text-decoration: none;
}
/*
#img-container p { width: 400px; margin: 0; padding: 0 0 12px 0; }
*/
#once { clear: left; }
Malheureusement je n'arrive pas à avoir l'image derrière le menu. Ni à le remonter. Voici le code de la page, pouriez-vous s'il vous plait me dire ce qu'il faut changer. MERCI!!!
/**
* CSS
*
* @version 1.0
* @author Vaska
* @author Gregory Cadar
*/
* {
margin: 0;
padding: 0;
}
body {
text-align: left;
font-size: 12px;
font-family: Helvetica, Arial, sans-serif;
background: #fff;
}
body.section-1 { }
body.section-2 { }
body.section-3 { }
#content a {
color: black;
text-decoration: none;
border-bottom: red solid 1px;
}
#content a:hover {
color: red;
border-bottom: red solid 1px;
}
img { border: none; }
.hide {
display: none;
}
#menu {
width: 215px;
overflow: auto;
top: 0;
bottom: 0;
left: 0;
position: fixed;
height: 100%;
background-color: rgba(255, 255, 255, 0.5);
font-weight: 100;
line-height: 120%;
paddingt: 20px;
margin: 20px;
}
#menu ul {
list-style: none;
margin: 0 0 12px 0;
}
#menu ul li.section-title { }
#menu a {
text-decoration: none;
color: #9d9d9d;
}
#menu a:hover {
text-decoration: none;
border-bottom: 1px red solid;
}
#menu .active a {
color: red;
}
#menu #menulink {
border-bottom: 1px white solid;
}
#content {
height: 100%;
margin: 0 0 0 225px;
padding-top: 57px;
top: 0;
text-align: left;
line-height: 120%;
}
.container {
padding: 5px 5px 25px 5px;
}
#content p { width: 600px; margin-bottom: 9px; }
p {
margin: 0 0 9px 0;
}
h1 { font-size: 32px; }
h2 { font-size: 24px; }
h3 { font-size: 16px; }
h4 { font-size: 12px; }
#img-container {
position: fixed;
top: 117px;
left: 230px;
margin: 0; padding: 0;
}
#img-container img {}
#img-container p.nav {
position: fixed;
top: 95px;
left: 230px;
margin: 0; padding: 0;
z-index: 100;
font-size: 10px;
}
#content #img-container a {
border: none;
}
#content #img-container a:hover {
color: red;
text-decoration: none;
}
/*
#img-container p { width: 400px; margin: 0; padding: 0 0 12px 0; }
*/
#once { clear: left; }