Lastnost background-color v CSS uporabi enobarvne barve kot ozadje na elementu. Tu je primer:
html ( background-color: #82a43a; )Zgoraj uporabljeni primer ( #82a43a) se imenuje šestnajstiška koda in je eden od več načinov, kako mora CSS predstavljati eno barvo. Obstaja več načinov, kako najti prave šestnajstiške kode. Kdor je uporabil orodje za oblikovanje, je videl izbirnik barv, podoben temu:
Šestnajstiške kode so en način za razglasitev barve v CSS. Obstaja tudi cel kup imen, ki jih lahko uporabite, na primer:
.page-wrap ( background: white; ) footer ( background: black; ) .almonds ( background: blanchedAlmond; )Te barve niso zelo prilagodljive, lahko pa vam pridejo v hipu. Lažje jih je zapomniti kot šestnajstiške kode in teh je na tone.
Drug način razglasitve barve je uporaba RGB, RGBa, HSL ali HSLa:
#page-wrap ( background: rgba(0, 0, 0, 0.8); /* 80% Black */ ) .widget ( background: hsla(170, 50%, 45%, 1); )Za razliko od šestnajstiških kod te vrednosti omogočajo preglednost (alfa), kar je lahko zelo koristno. Preberite več o RGBa ali HSLa.
Demo
Oglejte si barvo ozadja pisala CSS-Tricks (@ css-tricks) na CodePen.
Sorodno
- ozadje-priloga
- posnetek za ozadje
- slika ozadja
- izvor-izvor
- položaj ozadja
- ozadje-ponovitev
- velikost ozadja
Več virov
- Specifikacije CSS3
- MDN
Podpora za brskalnik
Hex kode in večina imen barv delujejo povsod. RGBa in HSLa imata lastne sklope podpore za brskalnike: RGBa in HSLa.
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Deluje | Deluje | Deluje | Deluje | Deluje | Deluje | Deluje |