Taustakuvan peittävyyden asettaminen CSS:ssä edellyttää taustakuva-ominaisuus opasiteettiominaisuuden kanssa. Säätämällä peittävyyttä säätelet taustakuvan läpinäkyvyyttä, jolloin sen takana olevat elementit näkyvät osittain läpi, mikä luo visuaalisesti kerrostetun tehosteen.
Käytämme seuraavia lähestymistapoja taustakuvan peittävyyden asettamiseen CSS:ssä:
Sisällysluettelo
kasaa lajitella
1. Opacity Property -ominaisuuden käyttäminen
The Opacity-ominaisuus CSS:ssä määrittää elementin ja sen sisällön läpinäkyvyystason. Arvojen hyväksyminen välillä 0 (täysin läpinäkyvä) ja 1 (täysin läpinäkymätön) vaikuttaa koko elementtiin, mukaan lukien sen alat, mikä tekee siitä yksinkertaisen ja tehokkaan tavan hallita läpinäkyvyyttä verkkosuunnittelussa.
Syntaksi:
div { opacity: 0.5; }> Esimerkki: Element-luokan CSS-tyylin peittävyysominaisuus on asetettu arvoon 0,3, mikä tekee taustakuvasta puoliläpinäkyvän. Tämä säätää taustan näkyvyyttä säilyttäen samalla tekstin luettavuuden.
HTML
> <>html> lang>=>'en'>>>> head>>>> meta> charset>=>'UTF-8'>>>> meta> name>=>'viewport'> content>=>'width=device-width, initial-scale=1.0'>>>> title>>Taustakuvan opasiteetti> |