Úvod do farebného názvu v HTML

Názov farby v HTML hrá veľmi dôležitú úlohu v procese navrhovania webu a aplikácií. Pomáha to zmeniť vzhľad a dojem našej webovej stránky alebo aplikácie. Rovnako robí našu aplikáciu atraktívnejšou a interaktívnejšou. Existuje niekoľko spôsobov, ako zadefinovať názov farby v HTML do kódovacieho formátu HTML. na efektívnejšie využitie je možné použiť ďalšie vlastnosti CSS. Názov farby HTML sme schopní použiť na úrovni stránky jeho začlenením do časti tela, ktorá je tiež schopná nastaviť individuálnu farbu na konkrétny prvok. Názov farby v HTML sa zámerne používa pre farbu textu, farbu pozadia, farbu orámovania, tiene, prechody a mnoho ďalších.

syntax

  • Existujú rôzne spôsoby, ako môžeme použiť farby HTML. Pozrime sa jeden po druhom.
  • Základným použitím farby HTML je jej použitie v texte. jednoducho použite ako farbu textu na zobrazenie textu v rôznych farbách HTML.

1. Syntax farieb textu

color : color_name;

Pozrime sa, ako bude táto syntax fungovať,

Welcome to EDUBCA

Vo vyššie uvedenom príklade sa zobrazí text Vitajte v EDUBCA v modrej farbe, ako napríklad:

  • Pomocou farieb HTML je možné ich tiež pridať ako farbu pozadia.

2. Syntax farby pozadia

background-color:color_name;

Pozrime sa, ako bude táto syntax fungovať,

V tejto kategórii sa nachádzajú všetky informácie o dizajne šíriace sa v mnohých podkategóriách v rámci kurzu Dizajn.

  • Farebný rámček okolo ľubovoľného textu alebo prvku je možné pridať aj pomocou farby HTML pomocou nasledujúcej syntaxe:

3. Farba orámovania Syntax: orámovanie

value color_name;

Pozrime sa, ako bude táto syntax fungovať,

EDUCBA free certification course

Typy názvu farby v HTML

Existujú rôzne spôsoby, ako definovať názvy farieb v HTML. Je ťažké si zapamätať iné meno v rôznych farbách. Preto je potrebné dať niektorým hodnotám rôzne farby. Pozrime sa jeden po druhom

1. Hodnota RGB

  • Je to jeden zo spôsobov, ako definovať názvy farieb HTML v kombinácii hodnôt formátu červenej, zelenej a modrej farby. Ktorá sa používa na definovanie intenzity farieb medzi číslami 0 až 255?
  • Predpokladajme, že chceme definovať čiernu farbu pomocou kombinácie RGB, potom sa bude páčiť RGB (0, 0, 0). Tu sa všetky parametre farby nastavia na 0. Takže sa zobrazí čierna farba.
  • Rovnako ako ďalšie RGB (0, 0255) sa zobrazí farba modrá, pretože 255 sa nastaví ako najvyššia hodnota na modrú a druhá 0.
  • Ak sa chystáme na 3 rovnaké hodnoty RGB, bude generovať odtiene sivej farby.

Príklad: RGB (0, 0, 0) pre najtmavšiu farbu, kde RGB (255 255 255) pre najsvetlejšiu farbu.

2. Hodnota HEX

  • Je to jeden z najbežnejšie používaných formátov názvu farby v HTML, v ktorom bude názov farby definovaný vo formáte hexadecimálnej hodnoty.
  • # rrggbb formát obsahuje hodnoty z RR pre červenú, gg pre zelenú a bb pre modrú sú umiestnené medzi hexadecimálnou hodnotou 00 toff.
  • Pozrime sa na jeden príklad definovania farby # 00ff00. takže tieto hodnoty sa vygenerujú zelenou farbou, pretože zelená obsahuje najvyššiu hodnotu (ff), pričom druhá sa nastaví na 00.

3. Hodnota HSL

  • Ďalší formát na definovanie farby HTML vo forme odtieňa, sýtosti, ľahkosti.
  • Teraz uvidíme všetky pojmy jeden po druhom. Odtieň je definovaný ako stupeň farby, ktorý je v rozsahu 0 až 360. v ktorých 0 pre červenú, 120 pre zelenú a 240 pre modrú.
  • Sýtosť definuje hodnotu farby v percentách, v ktorých 0% hovorí odtieň šedej, kde 100% pre plnú farbu.
  • Svetlosť tiež funguje ako percento, ktoré definuje 0% pre čiernu, 50% nie je pre svetlo ani tmu, kde 100% pre bielu.

4. Hodnota RGBA

  • Tento typ farby HTML definuje rozšírenie pre farbu RGB vrátane hodnoty alfa. Ak sa alfa používa na definovanie nepriehľadnosti farby.
  • Hodnota alfa sa pohybuje od 0, 0 (plne priehľadný) do 1, 0 (vôbec nepriesvitný)
  • Príkladom je rgba (255, 99, 71, 0)

5. Hodnota HSLA

  • Funguje rovnako ako hodnota farieb HSL a navyše s ňou vytvára aj hodnotu alfa na definovanie nepriehľadnosti farby.
  • hsla (8 100%, 80%, 0) pre úplne priehľadnú farbu.
  • hsla (8 100%, 80%, 0, 9) za toľko nepriehľadné farby,

Príklady farebného názvu v HTML

Pozrime sa, ako sa používa názov farby v HTML pomocou niekoľkých príkladov uvedených nižšie:

Príklad č. 1

Uvažujme o všeobecnom príklade, ktorý ukazuje, ako sa bude používať názov vzorovej farby v HTML:

HTML kód:



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun

Dozviete sa viac z neúspechu ako z úspechu. Nenechajte sa zastaviť. Znak budovania zlyhania. Ak pracujete na niečom, na čom vám skutočne záleží, nemusíte byť tlačení. Vízia ťa vytiahne

Výkon:

Príklad č. 2

Teraz uvádzame ďalší príklad, ktorý definuje všetky typy farieb HTML nasledovne:

HTML kód:



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade

Výkon:

Vo vyššie uvedenom príklade sme schopní vidieť použitie rôznych typov farieb HTML a ako sú pomenované v HTML.

Príklad č. 3

Jedným ďalším použitím farby HTML je definovanie orámovania prvku, ktoré je nasledujúce:

V príklade tu dokážeme do tela kódu pridať ohraničenie a tiež zmeniť pozadie a farbu textu.

HTML kód:

Samoaktualizujúca teória hovorí o vnútorných odmenách spojených s výkonom úlohy, ako je spokojnosť s prácou, pocit úspechu atď.

Výkon:

záver

Zistili sme, že farby HTML sú definované s rôznymi názvami, percentuálnou hodnotou, hexadecimálnou hodnotou, alfa hodnotou a mnohými ďalšími. Názov farby v HTML sa používa na vytváranie farieb pre text, pre pozadie, pre okraj, pre gradácie. Existujú rôzne typy na definovanie názvu farby HTML ako RGB, hex, hsl, rgba, hsla.

Odporúčané články

Toto je sprievodca farebným názvom v HTML. Tu diskutujeme úvod, Typy farebných názvov v HTML spolu s príkladmi, Syntax a HTML kódy. Viac informácií nájdete aj v ďalších navrhovaných článkoch -

  1. Atribút štýlu HTML
  2. Značky tabuliek HTML
  3. Odkaz na obrázok v HTML
  4. Vytvorte tabuľky v HTML
  5. Udalosti HTML

Kategórie:

Nástroje na vývoj webových aplikácií