CSS: Barvy
Pro zápis barev v CSS existují 3 způsoby:
- Hexadecimálním tvarem - #00AF23
- Jménem (názvem) - blue, green, white
- Pomocí rgb, poměru červené, zelené a modré - rgb(10%, 20%,70%)
Šestnáctkový(hexadecimální) zápis a procenty
Výchází z poměru RGB (červené, zelené a modré). V šestnáctkové soustavě jsou číslice 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F. F znamená 16. 11 znamená 17 v desítkové. Takže když chcete smíchat 255 červené 255 zelené 255 modré, musíte převést tato čísla na šestnáctková - FF FF FF. Teď stačí čísla spojit #FFFFFF. Většina editorů vám nabídne paletu a vy si vyberete. Více o šestnáctkové soustavě
Pomocí názvů barev
Anglické názvy barev
16 základních barev, které se vždy bezpečně zobrazí | |||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
white | blue | red | green | yellow | gray | black | fuchsia | ||||||||
silver | teal | purple | maroon | aqua | lime | navy | olive |
To je 16 základních barev, které s jistotou podporuje každý prohlížeč a počítač. Neznamená to, že jiné podporovány nejsou, tak to bývalo dříve, ale může se to stát
Pomocí tvaru rgb
Každá barva se skládá z červené(red), zelené(green) a modré(blue) zaleží jen na tom, kolik které dáte.
- Buď zapisujete procenty -
Červená a modrá je fialová, tak dáte 50% červené a 50% modré style="color: rgb(50%, 0%, 50%)" - Nebo čísly -
rgb(0, 0, 0) - je černá, rgb(255, 255, 255) je bílá, ostatní barvy se nacházejí mezi tím.
Vložení do CSS
Např.:
<style> h1 {color: red;} h2 {color: rgb(50%, 0%, 50%);} h3 {color: #00ccff;} .modra {background-color: blue; border: 1px gray solid} </style>
To je jen příklad nadpis h1 bude modrý, h2 fialový, h3 tyrkysový a třída modra bude mít modré pozadí a šedý rámeček.
Jak barvy zjistit
Použijte nějaký editor webových stránek, který vám poskytne barevné palety (případně i grafický editor)
Vyhledávání
Základy
Reference
Vlastnosti
CSS vlastnosti abecedně
- backgroud-position backgroundbackground-attachementbackground-colorbackground-imagebackground-repeatborderborder-bottomborder-bottom-colorborder-bottom-styleborder-bottom-widthborder-colorborder-leftborder-left-colorborder-left-styleborder-left-widthborder-rightborder-right-colorborder-right-styleborder-right-widthborder-styleborder-topborder-top-colorborder-top-styleborder-top-widthborder-widthbottomheightline-heightmarginmargin-bottommargin-leftmargin-rightmargin-topmax-heightmin-heightmin-widthpaddingpadding-bottompadding-leftpadding-rightpadding-topwidth
Poradna
Pokud si nevíte rady, chcete kontakt na spolehlivého tvůrce webu, či vás zajímá cizí názor, ozvěte se.