Voici quelques titres basés sur des questions basés sur l’article fourni : Officiel

Remplacement de l'opacité héritée pour les éléments enfants

En CSS, les éléments héritent de l'opacité de leurs éléments parents. Pour ajuster uniquement l'opacité du parent tout en préservant l'apparence originale de l'enfant, envisagez les approches suivantes :

1. Calculs d'opacité :

Les valeurs d'opacité sont multiplicatives. Cela signifie qu'un élément avec une opacité de 0,5 au sein d'un parent avec une opacité de 0,6 aura une opacité effective de 0,3 (0,5 * 0,6).

Exemple :

<code class="css">#parent {
  opacity: 0.6;
}

#child {
  opacity: 1;
}</code>

Dans cet exemple, l'élément #child apparaîtra opaque même si son parent a une opacité translucide.

2. Repositionner l'enfant :

Si possible, déplacez l'élément #child en dehors de l'élément #parent. Cela évitera à l'enfant d'hériter de l'opacité du parent.

3. Utilisation des couleurs RGBA pour l'enfant :

Au lieu de définir l'opacité directement sur le parent, utilisez des couleurs RGBA pour l'arrière-plan, la bordure ou la police de l'élément enfant. Les couleurs RGBA spécifient l'opacité comme quatrième valeur :

<code class="css">#child {
  background-color: rgba(255, 165, 0, 0.5);
}</code>

Remarques supplémentaires :

• Le remplacement de l'opacité héritée peut ne pas être possible si l'élément enfant utilise un valeur d'opacité inférieure à 1.
• L'utilisation de couleurs RGBA ne reproduit pas entièrement l'effet de l'opacité, car elle n'affecte que la couleur de l'élément enfant.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!