Configurar l'opacitat d'una imatge de fons en CSS implica utilitzar el propietat de la imatge de fons juntament amb la propietat d'opacitat. En ajustar l'opacitat, controleu la transparència de la imatge de fons, permetent que els elements que hi ha darrere es mostrin parcialment, creant un efecte visual en capes.
Estem utilitzant els enfocaments següents per configurar l'opacitat de la imatge de fons en CSS:
Taula de contingut
objecte java
1. Ús de la propietat Opacitat
El Propietat d'opacitat en CSS estableix el nivell de transparència d'un element i el seu contingut. L'acceptació de valors entre 0 (totalment transparent) i 1 (totalment opac), afecta tot l'element, inclosos els seus fills, fent-lo una forma senzilla i eficaç de controlar la transparència en el disseny web.
Sintaxi:
div { opacity: 0.5; }> Exemple: La propietat d'opacitat a l'estil CSS de la classe .element s'estableix en 0.3, fent que la imatge de fons sigui semitransparent. Això ajusta la visibilitat del fons mentre es manté la llegibilitat del text.
HTML
> <>html> lang>=>'en'>>> ><>head>>> ><>meta> charset>=>'UTF-8'>>> ><>meta> name>=>'viewport'> content>=>'width=device-width, initial-scale=1.0'>>> ><>title>>Opacitat del títol de la imatge de fons> |