CSS-i taustavärvi omadus rakendab elemendi taustana ühevärvilisi värve. Siin on näide:
html ( background-color: #82a43a; )Eespool kasutatud näidet ( #82a43a) nimetatakse kuuskoodiks ja see on üks mitmest viisist, kuidas CSS peab esindama ühte värvi. Õigete heksakoodide leidmiseks on mitmeid viise. Igaüks, kes on kujundustööriista kasutanud, on näinud sellele sarnast värvivalijat:
Hex-koodid on üks viis CSS-is värvi deklareerimiseks. Samuti on terve hulk nimesid, mida saate kasutada, näiteks:
.page-wrap ( background: white; ) footer ( background: black; ) .almonds ( background: blanchedAlmond; )Need värvid pole eriti paindlikud, kuid näpistades võivad need kasuks tulla. Neid on lihtsam meelde jätta kui kuuskoode ja neid on tonni.
Teine viis värvi deklareerimiseks on RGB, RGBa, HSL või HSLa kasutamine:
#page-wrap ( background: rgba(0, 0, 0, 0.8); /* 80% Black */ ) .widget ( background: hsla(170, 50%, 45%, 1); )Erinevalt heksakoodidest võimaldavad need väärtused läbipaistvust (alfa), mis võib olla ülikasulik. Lisateave RGBa või HSLa kohta.
Demo
Vaadake CodePenil CSS-Tricksi pliiatsi taustavärvi (@ css-tricks).
Seotud
- taust-kinnitus
- taustklipp
- taustapilt
- taust-päritolu
- taust-positsioon
- taust-kordus
- tausta suurus
Rohkem ressursse
- CSS3 spetsifikatsioon
- MDN
Brauseri tugi
Hex-koodid ja enamik värvinimesid töötavad kõikjal. RGBa ja HSLa-l on oma brauseritoe komplektid: RGBa ja HSLa.
| Chrome | Safari | Firefox | Ooper | IE | Android | iOS |
|---|---|---|---|---|---|---|
| Töötab | Töötab | Töötab | Töötab | Töötab | Töötab | Töötab |