Je veux faire disparaître le menu de la liste en utilisant l'opacité sans affecter la police. Est-ce possible avec CSS3?
maintenant vous pouvez utiliser rgba dans les propriétés CSS comme ceci:
.class{
background: rgba(0,0,0,0.5);
}
0.5 est la transparence , modifiez les valeurs en fonction de votre conception.
Démo en direct http://jsfiddle.net/EeAaB/
plus d'infos http://css-tricks.com/rgba-browser-support/
Gardez ces trois options à l’esprit (vous voulez le n ° 3):
1) L'élément entier est transparent:
visibility: hidden;
2) L'élément entier est quelque peu transparent:
opacity: 0.0 - 1.0;
3) Seul le background de l'élément est transparent:
background-color: transparent;
oui, c'est possible. utilisez simplement rgba-syntax pour la couleur de fond.
.menue{
background-color: rgba(255, 0, 0, 0.5); //semi-transparent red
}
Dans ce cas, background-color:rgba(0,0,0,0.5);
est la meilleure solution. Par exemple: background-color:rgba(0,0,0,opacity option);
Voici un exemple de classe utilisant les couleurs CSS nommées:
.semi-transparent {
background: yellow;
opacity: 0.25;
}
Cela ajoute un fond opaque à 25% (coloré) et transparent à 75%.
MISE EN GARDE Malheureusement, l'opacité affectera alors tout l'élément auquel il est attaché.
Donc, si vous avez du texte dans cet élément, le texte sera également réglé sur une opacité de 25%. :-(
La solution consiste à utiliser les méthodes rgba
ou hsla
pour indiquer la transparence dans la "couleur" d’arrière-plan souhaitée. Cela vous permet de spécifier la transparence de l'arrière-plan, indépendamment de la transparence des autres éléments de votre élément.
Voici trois manières de définir un arrière-plan bleu à 75% de transparence, sans affecter les autres éléments:
background: rgba(0%, 0%, 100%, 0.75)
background: rgba(0, 0, 255, 0.75)
background: hsla(240, 100%, 50%, 0.75)
Essaye ça:
opacity:0;
Pour IE8 et les versions antérieures
filter:Alpha(opacity=0);