xpatval Posté 9 Février 2018 Posté 9 Février 2018 Bonjour, Bon, titre bizarre... En fait, mon problème est le suivant: j'ai un container, avec une opacité (css) de 0.8. Celui-ci contient d'autres containers, pour lesquels je ne veux pas d'opacité (des images, notamment). Or, malgré un test avec opacity à 1 (toujours css, et dans ces "sous-containers"), je n'obtiens rien de plus. Comment dois-je m'y prendre ? Dois-je jouer avec des z-index ? Merci de vos réponses
Aenoa Posté 9 Février 2018 Posté 9 Février 2018 l'opacité du parent s'applique a son propre container, si le premier niveau est a 0.8 et dedans tu met un 1.0 ça sera 1.0x 0.8 donc 0.8; Si tu le met à 0.5, ça sera 0,5x 0,8 d'opacité soit 0.4 d'opacité pour l'enfant. Si tu désire qu'un container interne ai une opacité de 1.0, tu peux éventuellement le mettre en position: absolute au même niveau que ton container transparent, et jouer avec le Z-index en effet. Si c'est juste pour avoir un fond un peu transparent de couleur, je ne peux que te conseiller d'utiliser la propriété css "background-color: rgba(0a255rouge, 0a255vert, 0a255bleu, opacité). Si tu veux du noir (0, 0 et 0 en RGB) avec une opacité de 0.8, tu peux donc mettre background-color: rgba(0,0,0,0.8); et le tour sera joué
xpatval Posté 10 Février 2018 Auteur Posté 10 Février 2018 Merci de ta réponse. Je suis un peu étonné du résultat: à l'origine, j'avais dans le container parent un background-color: #333; suivi d'un opacity:0.8; . Le container fils était lui aussi opacifié (ce que je ne voulais pas, d'où ma question ici). Le simple fait de changer le #333 en rgba(51,51,51,0.8) me permet d'arriver au résultat escompté ! Pourquoi ?
Sujets conseillés
Veuillez vous connecter pour commenter
Vous pourrez laisser un commentaire après vous êtes connecté.
Connectez-vous maintenant