Modrá přidat html. Barevné kódy v Minecraftu
Vlad Merževič
V HTML se barva určuje jedním ze dvou způsobů: pomocí hexadecimálního kódu a názvem určitých barev. Převážně se používá metoda založená na hexadecimální číselné soustavě, protože je nejuniverzálnější.
Hexadecimální barvy
HTML používá k určení barev hexadecimální čísla. Šestnáctková soustava je na rozdíl od desítkové soustavy založena, jak její název napovídá, na čísle 16. Čísla budou následující: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A , B, C , D, E, F. Čísla od 10 do 15 jsou nahrazena latinkou. V tabulce 6.1 ukazuje shodu mezi desetinnými a šestnáctkovými čísly.
Čísla větší než 15 v šestnáctkové soustavě se tvoří spojením dvou čísel do jednoho (tab. 6.2). Například číslo 255 v desítkové soustavě odpovídá číslu FF v šestnáctkové soustavě.
Aby se předešlo zmatkům při definování číselného systému, před šestnáctkovým číslem je uveden symbol hash #, například #aa69cc. V tomto případě nezáleží na velikosti písmen, takže je přípustné psát #F0F0F0 nebo #f0f0f0.
Typická barva používaná v HTML vypadá takto.
Zde je barva pozadí webové stránky nastavena na #FA8E47. Symbol hash # před číslem znamená, že je hexadecimální. První dvě číslice (FA) definují červenou složku barvy, třetí až čtvrtá číslice (8E) definují zelenou složku a poslední dvě číslice (47) definují modrou složku. Konečným výsledkem bude tato barva.
| F.A. | + | 8E | + | 47 | = | FA8E47 |
Každá ze tří barev – červená, zelená a modrá – může nabývat hodnot od 00 do FF, což má za následek celkem 256 odstínů. Celkový počet barev tedy může být 256x256x256 = 16 777 216 kombinací. Barevný model založený na červené, zelené a modré složce se nazývá RGB (červená, zelená, modrá; červená, zelená, modrá). Tento model je aditivní (od add - add), ve kterém přidáním všech tří složek vzniká barva bílá.
Chcete-li usnadnit navigaci v hexadecimálních barvách, vezměte v úvahu některá pravidla.
- Pokud jsou hodnoty barevných složek stejné (například: #D6D6D6), výsledkem bude šedý odstín. Čím vyšší číslo, tím světlejší barva, s hodnotami od #000000 (černá) do #FFFFFF (bílá).
- Jasně červená barva se vytvoří, pokud je červená složka nastavena na maximum (FF) a zbývající složky jsou nastaveny na nulu. Barva s hodnotou #FF0000 je nejčervenější možný červený odstín. Totéž platí pro zelenou (#00FF00) a modrou (#0000FF).
- Žlutá (#FFFF00) se vyrábí smícháním červené a zelené. To je dobře vidět na barevném kolečku (obr. 6.1), které představuje primární barvy (červená, zelená, modrá) a doplňkové nebo doplňkové. Patří mezi ně žlutá, azurová a fialová (nazývaná také purpurová). Obecně lze jakoukoli barvu získat smícháním barev blízko ní. Azurová (#00FFFF) se tedy získá kombinací modré a zelené.
Rýže. 6.1. Barevné kolečko
Barvy založené na hexadecimálních hodnotách nemusí být vybrány empiricky. K tomuto účelu je vhodný grafický editor, který umí pracovat s různými barevnými modely, například Adobe Photoshop. Na Obr. Obrázek 6.2 ukazuje okno pro výběr barvy v tomto programu, výsledná hexadecimální hodnota aktuální barvy je ohraničena čarou. Můžete jej zkopírovat a vložit do kódu.
Rýže. 6.2. Okno pro výběr barev ve Photoshopu
Webové barvy
Pokud nastavíte kvalitu podání barev monitoru na 8 bitů (256 barev), pak se stejná barva může v různých prohlížečích zobrazovat různě. Je to způsobeno způsobem zobrazení grafiky, kdy prohlížeč pracuje s vlastní paletou a nemůže zobrazit barvu, která není v jeho paletě. Barva je v tomto případě nahrazena kombinací pixelů jiných, jemu blízkých barev, které danou imitují. Aby barva zůstala stejná napříč různými prohlížeči, byla představena paleta takzvaných webových barev. Webové barvy jsou barvy, pro které je každá komponenta – červená, zelená a modrá – nastavena na jednu ze šesti hodnot – 0 (00), 51 (33), 102 (66), 153 (99), 204 (CC) 255 (FF). Hexadecimální hodnota této složky je uvedena v závorce. Celkový počet barev ze všech možných kombinací dává 6x6x6 - 216 barev. Příklad webové barvy je #33FF66.
Hlavním rysem webové barvy je, že se ve všech prohlížečích zobrazuje stejně. V tuto chvíli je relevance webových barev velmi malá díky zkvalitnění monitorů a rozšíření jejich možností.
Barvy podle názvu
Abyste si nemuseli pamatovat sadu čísel, můžete místo nich použít názvy běžně používaných barev. V tabulce 6.3 ukazuje názvy oblíbených barev.
| Název barvy | Barva | Popis | Hexadecimální hodnota |
|---|---|---|---|
| černý | Černý | #000000 | |
| modrý | Modrý | #0000FF | |
| fuchsie | Světle fialová | #FF00FF | |
| šedá | Tmavě šedá | #808080 | |
| zelený | Zelený | #008000 | |
| vápno | Světle zelená | #00FF00 | |
| kaštanové | Tmavě červená | #800000 | |
| námořnictvo | Tmavě modrá | #000080 | |
| olivový | Olivový | #808000 | |
| fialová | Tmavě fialová | #800080 | |
| červený | Červený | #FF0000 | |
| stříbro | Světle šedá | #C0C0C0 | |
| modrozelená | Modro-zelená | #008080 | |
| bílý | Bílý | #FFFFFF | |
| žluť | Žluť | #FFFF00 |
Nezáleží na tom, zda barvu určíte jejím názvem nebo pomocí hexadecimálních čísel. Tyto metody jsou svým účinkem rovnocenné. Příklad 6.1 ukazuje, jak nastavit barvu pozadí a textu webové stránky.
Příklad 6.1. Barva pozadí a textu
Příklad textu
V tomto příkladu je barva pozadí nastavena pomocí atributu bgcolor značky
a barvu textu prostřednictvím atributu text. Pro zpestření je atribut text nastaven na hexadecimální číslo a atribut bgcolor je nastaven na vyhrazené klíčové slovo teal .Barevné kódy v CSS se používají k určení barev. Barevné kódy nebo hodnoty barev se obvykle používají k nastavení barvy buď pro barvu popředí prvku (např. barva textu, barva odkazu) nebo barvu pozadí prvku (barva pozadí, barva bloku). Lze je také použít ke změně barvy tlačítka, ohraničení, značky, vznášení a dalších dekorativních efektů.
Hodnoty barev můžete zadat v různých formátech. V následující tabulce jsou uvedeny všechny možné formáty:
Uvedené formáty jsou podrobněji popsány níže.
CSS barvy - Hex kódy
Hexadecimální kód barvy je šestimístná reprezentace barvy. První dvě číslice (RR) představují červenou hodnotu, další dvě představují zelenou hodnotu (GG) a poslední dvě představují modrou hodnotu (BB).
CSS barvy - krátké hexadecimální kódy
Krátký hexadecimální kód barvy je kratší forma šestiznakového zápisu. V tomto formátu se každá číslice opakuje, aby vznikla ekvivalentní šestimístná hodnota barvy. Například: #0F0 se změní na #00FF00.
Hexadecimální hodnotu lze převzít z libovolného grafického softwaru, jako je Adobe Photoshop, Core Draw atd.
Každému hexadecimálnímu barevnému kódu v CSS bude předcházet znak hash „#“. Níže jsou uvedeny příklady použití hexadecimálních zápisů.
CSS barvy – hodnoty RGB
hodnota RGB je kód barvy, který se nastavuje pomocí vlastnosti rgb(). Tato vlastnost má tři hodnoty: jednu pro červenou, zelenou a modrou. Hodnota může být celé číslo od 0 do 255 nebo procento.
Poznámka: Ne všechny prohlížeče podporují vlastnost barvy rgb(), proto se nedoporučuje ji používat.
Níže je uveden příklad ukazující více barev pomocí hodnot RGB.
Generátor barevných kódů
Pomocí naší služby můžete vytvořit miliony barevných kódů.
Bezpečné barvy pro prohlížeč
Níže je tabulka 216 barev, které jsou nejbezpečnější a nejvíce nezávislé na počítači. Tyto barvy v CSS se pohybují od 000000 do FFFFFF hexadecimálního kódu. Jejich použití je bezpečné, protože zajišťují, že všechny počítače zobrazují barvy správně při práci s paletou 256 barev.
| Tabulka "bezpečných" barev v CSS | |||||
| #000000 | #000033 | #000066 | #000099 | #0000 CC | #0000FF |
| #003300 | #003333 | #003366 | #003399 | #0033CC | #0033FF |
| #006600 | #006633 | #006666 | #006699 | #0066CC | #0066FF |
| #009900 | #009933 | #009966 | #009999 | #0099CC | #0099FF |
| #00CC00 | #00CC33 | #00CC66 | #00CC99 | #00CCCC | #00CCFF |
| #00FF00 | #00FF33 | #00FF66 | #00FF99 | #00FFCC | #00FFFF |
| #330000 | #330033 | #330066 | #330099 | #3300 CC | #3300FF |
| #333300 | #333333 | #333366 | #333399 | #3333CC | #3333FF |
| #336600 | #336633 | #336666 | #336699 | #3366CC | #3366FF |
| #339900 | #339933 | #339966 | #339999 | #3399CC | #3399FF |
| #33CC00 | #33CC33 | #33CC66 | #33CC99 | #33CCCC | #33CCFF |
| #33FF00 | #33FF33 | #33FF66 | #33FF99 | #33FFCC | #33FFFF |
| #660000 | #660033 | #660066 | #660099 | #6600 CC | #6600FF |
| #663300 | #663333 | #663366 | #663399 | #6633CC | #6633FF |
| #666600 | #666633 | #666666 | #666699 | #6666CC | #6666FF |
| #669900 | #669933 | #669966 | #669999 | #6699CC | #6699FF |
| #66CC00 | #66CC33 | #66CC66 | #66CC99 | #66CCCC | #66CCFF |
| #66FF00 | #66FF33 | #66FF66 | #66FF99 | #66FFCC | #66FFFF |
| #990000 | #990033 | #990066 | #990099 | #9900 CC | #9900FF |
| #993300 | #993333 | #993366 | #993399 | #9933CC | #9933FF |
| #996600 | #996633 | #996666 | #996699 | #9966CC | #9966FF |
| #999900 | #999933 | #999966 | #999999 | #9999CC | #9999FF |
| #99CC00 | #99CC33 | #99CC66 | #99CC99 | #99CCCC | #99CCFF |
| #99FF00 | #99FF33 | #99FF66 | #99FF99 | #99FFCC | #99FFFF |
| #CC0000 | #CC0033 | #CC0066 | #CC0099 | #CC00CC | #CC00FF |
| #CC3300 | #CC3333 | #CC3366 | #CC3399 | #CC33CC | #CC33FF |
| #CC6600 | #CC6633 | #CC6666 | #CC6699 | #CC66CC | #CC66FF |
| #CC9900 | #CC9933 | #CC9966 | #CC9999 | #CC99CC | #CC99FF |
| #CCCC00 | #CCCC33 | #CCCC66 | #CCCC99 | #CCCCCC | #CCCCFF |
| #CCFF00 | #CCFF33 | #CCFF66 | #CCFF99 | #CCFFCC | #CCFFFF |
| #FF0000 | #FF0033 | #FF0066 | #FF0099 | #FF00CC | #FF00FF |
| #FF3300 | #FF3333 | #FF3366 | #FF3399 | #FF33CC | #FF33FF |
| #FF6600 | #FF6633 | #FF6666 | #FF6699 | #FF66CC | #FF66FF |
| #FF9900 | #FF9933 | #FF9966 | #FF9999 | #FF99CC | #FF99FF |
| #FFCC00 | #FFCC33 | #FFCC66 | #FFCC99 | #FFCCCC | #FFCCFF |
| #FFFF00 | #FFFF33 | #FFFF66 | #FFFF99 | #FFFFCC | #FFFFFF |
Chuťové vjemy na webu bohužel zatím nelze zobrazovat. To se ale dá plně kompenzovat pomocí barev. Koneckonců, html barvy umožňují zobrazit jakýkoli z milionů odstínů. tak" barevné tužky V jeho sadě jich je mnohem víc než sedm.
Barevné schéma v html
V html lze barvu zadat v několika formátech:
1. Jako hexadecimální hodnota – použije se kód uvedený v hexadecimální číselné soustavě. Takové barevné kódy v html se skládají ze tří párů hexadecimálních čísel. Každý pár je zodpovědný za nasycení odstínu svou primární barvou:
- První číselný pár je zodpovědný za červenou barvu;
- Druhý pár je pro obsah zelené barvy;
- Ten druhý je pro svůj modrý obsah.
Na začátek kódu (před čísly) je umístěna značka hash. Toto je hexadecimální kód barvy. Kromě čísel od 1 do 9 tento číselný systém používá písmena latinské abecedy (A, B, C, D, E, F).
Například kód bílé barvy v html bude vypadat jako #FFFFFF:
2. Klíčové slovo – HTML aktuálně podporuje asi 147 klíčových slov. Ale ne všechna tato slova jsou jedinečná. Některé z nich odkazují na stejný barevný odstín.
Šedá barva je reprezentována dvěma klíčovými slovy: šedá a šedá . Jejich hexadecimální kód (HEX) je dán stejnou hodnotou #808080.
Příklad:
#808080
3. Ve formátu RGB - toto kódování barev v html je založeno na použití tří hodnot, nastavených v rozsahu od 0 do 255. Každá z nich určuje sytost odstínu jednou ze základních barev:
- R – červená (červená);
- G – zelená (zelená);
- B – modrá (modrá).
Číslo barvy ve formátu RGB se zapisuje v následujícím tvaru: rgb(0, 210, 100).
barva pozadí:rgb(100,186,43)
4. Ve formátu RGBA - jde o vylepšený formát RGB, kde čtvrtá hodnota určuje průhlednost barvy jako desetinný zlomek od 0 do 1.
Příklad použití:
barva pozadí:rgba(100,86,143,0,2)
barva pozadí:rgba(100,86,143,0,5)
barva pozadí:rgba(100,86,143,0,8)
barva pozadí:rgba(100,86,143,1)
HTML barevné tabulky a generátory barev
S tak širokou škálou formátů nastavení barev je snadné se splést. Proto byla vynalezena speciální tabulka barev. Poskytuje 147 klíčových názvů barevných odstínů s kódy shody ve všech hlavních barevných standardech. Každé pole je navíc vybaveno lištou pro vizuální výběr barev. Jedna z těchto tabulek je uvedena na webu colorscheme.ru:
Ale i s tímto strukturováním sladění může být výběr správného odstínu obtížný. A není pravda, že tabulka barevných kódů bude obsahovat ten, který potřebujete.
Abychom tuto překážku obešli a co nejvíce usnadnili výběr správného odstínu, byly vyvinuty interaktivní webové služby. Jejich uživatelské rozhraní se může od sebe mírně lišit.
Na webu html-color-codes.info generátor barev vypadá takto:
A v rámci služby color-picker.appsmaster.co je tento nástroj implementován trochu jinak:
Sytost každé barvy v generátoru se nastavuje pomocí speciálních posuvníků. Vizuálně je odstín zobrazen barvou rámu a obdélníku na levé straně. Ve 3 polích dole je zobrazen kód barvy v základních formátech.
Ale generátor barev je k dispozici nejen na specializovaných stránkách. Téměř všechny grafické editory jsou vybaveny podobným nástrojem. Například Photoshop:
Bezpečnostní opatření při práci s barvou
A to bylo dávno, v době grafických karet, které podporovaly pouze 256 barev. V oněch vzdálených dobách mohly operační systémy zobrazit pouze určitý počet osmibitových odstínů bez zkreslení.
Poté byla vyvinuta skvělá tabulka bezpečných barev. Stanovila 216 odstínů, které bylo možné zobrazit bez zkreslení v kterémkoli z tehdejších prohlížečů. A dodnes toto" skvělý rukopis» je stále k dispozici na některých zdrojích:
V dnešní době se vše změnilo. Zcela se tedy ruší všechna bezpečnostní pravidla při práci s barvou v html. Koneckonců, moderní počítačový hardware podporuje více než 16 milionů různých odstínů. A 216 bezpečných barev upadlo v zapomnění.
