xpatval Posté 9 Février 2018 Partager 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 Lien vers le commentaire Partager sur d’autres sites More sharing options...
Aenoa Posté 9 Février 2018 Partager 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é Lien vers le commentaire Partager sur d’autres sites More sharing options...
xpatval Posté 10 Février 2018 Auteur Partager 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 ? Lien vers le commentaire Partager sur d’autres sites More sharing options...
Sujets conseillés
Veuillez vous connecter pour commenter
Vous pourrez laisser un commentaire après vous êtes connecté.
Connectez-vous maintenant