Setarea opacității unei imagini de fundal în CSS implică utilizarea proprietatea imaginii de fundal împreună cu proprietatea de opacitate. Prin ajustarea opacității, controlați transparența imaginii de fundal, permițând elementelor din spatele acesteia să apară parțial, creând un efect vizual stratificat.
Folosim următoarele abordări pentru a seta opacitatea imaginii de fundal în CSS:
Cuprins
panda iterrows
1. Utilizarea proprietății Opacity
The Proprietatea opacității în CSS stabilește nivelul de transparență al unui element și conținutul acestuia. Acceptarea valorilor între 0 (complet transparent) și 1 (complet opac), afectează întregul element, inclusiv copiii săi, făcându-l o modalitate simplă și eficientă de a controla transparența în web design.
Sintaxă:
div { opacity: 0.5; }> Exemplu: Proprietatea opacității în stilul CSS al clasei .element este setată la 0.3, făcând imaginea de fundal semi-transparentă. Aceasta ajustează vizibilitatea fundalului, menținând în același timp lizibilitatea textului.
HTML
> <>html> lang>=>'en'>>>>> head>>>>> meta> charset>=>'UTF-8'>>>>> meta> name>=>'viewport'> content>=>'width=device-width, initial-scale=1.0'>>>>> title>>Opacitatea titlului imaginii de fundal> |