Dnes je Přidat k oblíbeným

Barvy v HTML

Barva pozadí dokumentu


 Barva pozadí se nastavuje atributem bgcolor u tagu <body>.
<body bgcolor="red">
Vše se teď bude psát na červené pozadí!
</body>

Výsledek:
Vše se teď bude psát na červené pozadí!


Pro zadávání barev je zavedeno šestnáct hlavních názvů barev. To je ale dost málo, protože se jich dá použít 16 777 216 (2563). Těchto skoro sedmnáct milionů barev se zadává ve formátu šestimístného kódu hexadecimálních číslic. Vždy dva po sobě jdoucí znaky definují odstín jedné ze tří základních barev modelu RGB (R - red, G - green, B - blue = červená, zelená, modrá). Hodnoty odstínů barev je tedy možné ukládat v rozmezí 0 - 255 (! převedených do hexadecimálního kódu !) ve tvaru RRGGBB, před který se přidá znak "#".

Tabulku pro převod z šestnáctkové (hexadecimální) soustavy do desítkové (dekadické) a obráceně

Převod z hexadecimální do dekadické soustavy nova online

A nyní si projděme všechny pojmenované barvy i s jejich hexadecimálními kódy.

Jméno barvykód
Orchid#da70d6
MediumVioletRed#c71585
DeepPink#ff1493
HotPink#ff69b4
LavenderBlush#fff0f5
PaleVioleTRed#db7093
Crimson#dc143c
Pink#ffc0cb
LightPink#ffb6c1
snow#fffafa
LightCoral#f08080
RosyBrown#bc8f8f
IndianRed#cd5c5c
Red#ff0000
Firebrick#b22222
Brown #a52a2a
DarkRed#8b0000
Maroon#800000
MistyRose#ffe4e1
salmon#fa8072
tomato#ff6347
DarkSalmon#e9967a
Coral#ff7f50
OrangeRed#ff4500
LightSalmon#ffa07a
Sienna#a0522d
seashell#fff5ee
chocolate#d2691e
SaddleBrown#8b4513
SandyBrown#f4a460
PeachPuff#ffdab9
peru#cd853f
linen#faf0e6
bisque#ffe4c4
DarkOrange#ff8c00
BurlyWood#deb887
AntiqueWhite#faebd7
Tan#d2b48c
NavajoWhite#ffdead
BlanchedAlmond#ffebcd
PapayaWhip#ffefd5
moccasin#ffe4b5
Orange#ffa500
Wheat#f5deb3
OldLace#fdf5e6
FloralWhite#fffaf0
DarkGoldenrod#b8860b
Goldenrod#daa520
cornsilk#fff8dc
Gold#ffd700
LemonChiffon#fffacd
Khaki#f0e68c
PaleGoldenrod#eee8aa
DarkKhaki#bdb76b
ivory#fffff0
LightYellow#ffffe0
beige#f5f5dc
LightGoldenrodYellow#fafad2
Yellow#ffff00
Olive#808000
OliveDrab#6b8e23
YellowGreen#9acd32
DarkOliveGreen#556b2f
GreenYellow#adff2f
charTReuse#7fff00
LawnGreen#7cfc00
DarkSeaGreen#8fbc8b
honeydew#f0fff0
PaleGreen#98fb98
LightGreen#90ee90
LimeGreen#32cd32
Lime#00ff00
ForestGreen#228b22
Green#008000
DarkGreen#006400
SeaGreen#2e8b57
MediumSeaGreen#3cb371
SpringGreen#00ff7f
MintCream#f5fffa
MediumSpringGreen#00fa9a
MediumAquamarine#66cdaa
Aquamarine#7fffd4
Turquoise#40e0d0
LightSeaGreen#20b2aa
MediumTurquoise#48d1cc
azure#f0ffff
LightCyan#e0ffff
PaleTurquoise#afeeee
Aqua#00ffff
Cyan#00ffff
DarkCyan#008b8b
Teal#008080
DarkSlateGray#2f4f4f
DarkTurquoise#00ced1
CadetBlue#5f9ea0
PowderBlue#b0e0e6
LightBlue#add8e6
DeepSkyBlue#00bfff
SkyBlue#87ceeb
LightSkyBlue#87cefa
AliceBlue#f0f8ff
DodgerBlue#1e90ff
LightSlateGray#778899
SlateGray#708090
LightSteelBlue#b0c4de
RoyalBlue#4169e1
CornflowerBlue#6495ed
GhostWhite#f8f8ff
lavender#e6e6fa
Blue#0000ff
MediumBlue#0000cd
DarkBlue#00008b
MidnightBlue#191970
Navy#000080
SlateBlue#6a5acd
DarkSlateBlue#483d8b
MediumSlateBlue#7b68ee
MediumPurple#9370db
BlueViolet#8a2be2
Indigo#4b0082
DarkOrchid#9932cc
DarkViolet#9400d3
MediumOrchid#ba55d3
Thistle#d8bfd8
Plum#dda0dd
Violet#ee82ee
Fuchsia#ff00ff
Magenta#ff00ff
DarkMagenta#8b008b
purple#800080
White#ffffff
WhiteSmoke#f5f5f5
gainsboro#dcdcdc
LightGray#d3d3d3
Silver#c0c0c0
DarkGray#a9a9a9
Gray#808080
DimGray#696969
Black#000000

Mnoho začínajících tvůrců stránek ovšem udělá to, že vezmou několik barev, které se jim líbí a naplácají je k sobě. To je ovšem chyba, protože tyto splácaniny vypadají mnohdy odpudivě. Aby se Vám to nestalo, na internetu je výborný nástroj pro tvorbu barevných schémat. Jen pro doplnění připomínám, že barevná schémata se tvoří buď jednobarevně, kontrastně (červená a zelená), jako trojice (modrá, žlutá, červená), čtveřice (zelenomodrá, zelenožlutá, červenomodrá, červenožlutá) nebo analogicky (tři červené a zelená).

Obrázek na pozadí

Obrázek jako pozadí nastavíte atributem background u tagu body. Je ale třeba dbát na to, aby pozadí nepůsobilo příliš rušivě a aby na něm byl text dobře čitelný. Pokud je však zvolen chytrý motiv, může výsledek vypadat velmi působivě.
Pokud nastavíme jako pozadí tento obrázek Obrázek malý
pak bude výsledek příkazu
<body background="images/poz_maly.gif">
</body>
následovný:
Obrázek velký

Nakonec je třeba ještě připomenout, že pokud nastavíte barvu pozadí, je třeba zvolit dostatečně kontrastní barvu písma. Jak na to, najdete v kapitole formátování.


TagPárovýVýznamAtributy
bodyanodefinuje tělo dokumentubgcolor="barva pozadí dokumentu"
background="URL obrázku použitého jako pozadí"
link, alink, vlink (vysvětlení v kapitole o formátování)
Design a kód Kookie © 2009 | Nahoru| O webu | Televize online | TV online
Základy jazyka HTML Strukturování textů Formátování textu Tvorba seznamů Tvorba odkazů Grafika stránek Barvy na webu Tvorba tabulek Tvorba rámců Tvorba formulářů Neutrální tagy Vývoj HTML- XHTML Úvod do CSS Zápis CSS a propojení s HTML Selektory Výstupní zařízení Dědičnost a kaskáda Typy prvků v CSS Kompletní přehled CSS vlastností Rozdílný vzhled v prohlížečích Délkové jednotky v CSS Ořezávání a posun Obtékání Absolutní pozicování v CSS Relativní pozicování v CSS Layout absolutním pozicováním Layout relativním pozicováním Pokročilý layout - tzv. Svatý grál Nechte své stránky vydělávat! Jak zvýšit návštěvnost Seznam katalogů PHP - dynamické stránky Javascript