Comment puis-je contrôler l'opacité de la couleur d'arrière-plan en CSS sans affecter l'opacité du texte ?

Contrôle de l'opacité de la couleur d'arrière-plan en CSS

En CSS, l'attribution de la propriété opacité à un div affectera à la fois l'arrière-plan et le texte qu'il contient . Il est cependant possible de modifier l'opacité de la couleur de fond tout en conservant l'opacité du texte.

Utilisation de la fonction rgba()

La fonction rgba() peut être utilisée pour spécifiez la couleur d'arrière-plan et son canal alpha, qui contrôle l'opacité. La syntaxe est la suivante :

background: rgba(R, G, B, A);

• R, G et B représentent les valeurs rouge, verte et bleue de la couleur (soit des nombres entiers, soit des pourcentages).
• A représente la valeur du canal alpha, qui va de 0 (transparent) à 1 (opaque).

Pour exemple :

background: rgba(51, 170, 51, 0.6);

Ce code définit la couleur d'arrière-plan sur un vert translucide avec une opacité de 60 %, tandis que le texte à l'intérieur du div restera entièrement opaque.

Prise en charge du navigateur

Depuis 2018, la syntaxe rgba() est largement prise en charge dans tous les principaux sites Web. navigateurs.

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!