Tyvärr är det ännu inte möjligt att visa smakupplevelser på hemsidan. Men detta kan kompenseras fullt ut med Färgspektrum. När allt kommer omkring låter html-färger dig visa vilken som helst av miljontals nyanser. Så" färgade pennor Det finns många fler än sju i hans uppsättning.

Färgschema i html

I html kan färg anges i flera format:

1. Som ett hexadecimalt värde – används koden som anges i det hexadecimala talsystemet. Sådana färgkoder i html består av tre par hexadecimala tal. Varje par är ansvarigt för färgens mättnad med sin primära färg:

• Det första numeriska paret är ansvarigt för färgen röd;
• Det andra paret är för innehållet i grön färg;
• Det senare är för sitt blå innehåll.

En hash-markering placeras i början av koden (före siffrorna). Detta är den hexadecimala färgkoden. Förutom siffror från 1 till 9 använder detta nummersystem bokstäver i det latinska alfabetet (A, B, C, D, E, F).

Till exempel kommer den vita färgkoden i html att se ut som #FFFFFF:

2. Nyckelord - HTML stöder för närvarande cirka 147 nyckelord. Men alla dessa ord är inte unika. Vissa av dem hänvisar till samma färgnyans.

Färgen grå representeras av två nyckelord: grå och grå . Deras hexadecimala kod (HEX) ges av samma värde #808080.

Exempel:

#808080

3. I RGB-format - denna färgkodning i html är baserad på användningen av tre värden, inställda i intervallet från 0 till 255. Var och en av dem bestämmer färgens mättnad med en av de primära färgerna:

• R – röd (röd);
• G - grön (grön);
• B – blå (blå).

Färgnumret i RGB-format skrivs i följande form: rgb(0, 210, 100).

bakgrundsfärg:rgb(100,186,43)

4. B RGBA-format- Det är ett förbättrat RGB-format, där det fjärde värdet anger färgens genomskinlighet som en decimalbråk från 0 till 1.

Användningsexempel:

bakgrundsfärg:rgba(100,86,143,0.2)

bakgrundsfärg:rgba(100,86,143,0.5)

bakgrundsfärg:rgba(100,86,143,0.8)

bakgrundsfärg:rgba(100,86,143,1)

HTML-färgtabeller och färggeneratorer

Med ett så brett utbud av färginställningsformat är det lätt att bli förvirrad. Därför uppfanns ett speciellt färgbord. Den tillhandahåller 147 nyckelnamn på färgnyanser med överensstämmelsekoder i alla större färgstandarder. Dessutom är varje fält utrustat med en stapel för visuellt färgval. En av dessa tabeller presenteras på webbplatsen colorscheme.ru:

Men även med denna strukturering av matchning kan det vara svårt att välja rätt nyans. Och det är inte ett faktum att tabellen med färgkoder kommer att innehålla den du behöver.

För att komma runt detta hinder och göra det så enkelt som möjligt att välja rätt nyans har interaktiva webbtjänster utvecklats. Deras användargränssnitt kan skilja sig något från varandra.

På webbplatsen html-color-codes.info ser färggeneratorn ut så här:

Och inom tjänsten color-picker.appsmaster.co implementeras det här verktyget lite annorlunda:

Mättnaden för varje färg i generatorn ställs in med hjälp av speciella reglage. Visuellt visas nyansen av färgen på ramen och rektangeln på vänster sida. Längst ner visar 3 fält färgkoden i grundläggande format.

Men färggeneratorn är tillgänglig inte bara på specialiserade webbplatser. Nästan alla grafiska redaktörer är utrustade med ett liknande verktyg. Till exempel Photoshop:

Säkerhetsföreskrifter vid arbete med färg

Och det här var länge sedan, tillbaka i eran med grafikkort som endast stödde 256 färger. I dessa avlägsna tider OS kunde endast visa ett visst antal åttabitars nyanser utan distorsion.

Sedan drogs ett jättebra bord säkra färger. Den specificerade 216 nyanser som kunde visas utan förvrängning i någon av den tidens webbläsare. Och till denna dag denna " stort manuskript» är fortfarande tillgänglig på vissa resurser:

Nuförtiden har allt förändrats. Därför är alla säkerhetsregler vid arbete med färg i html helt upphävda. När allt kommer omkring stöder modern datorhårdvara mer än 16 miljoner olika nyanser. Och 216 säkra färger har sjunkit i glömska.

Dessa uppgifter bekräftas till fullo av statistik. Att döma av det, 2014, har endast 0,5% av användarna datorer som endast stöder 256 nyanser.

Grunderna för färgharmoni

Alla av oss är inte utrustade med ett naturligt harmoniskt smaksinne. Det är därför rätt val färger kan vara en riktig utmaning. Men, beröm till vetenskapen, lyckades hon till och med beskriva färgharmoni i form av flera scheman. Alla är baserade på användningen av ett färghjul. Schema för harmoniskt färgval i html:

• Parallellt färgschema - när båda nyanserna i färghjulet är parallella;
• Triadiskt schema - alla hörn av en triangel är baserade på en av färgerna;
• Monokromatisk - när flera nära nyanser av samma färg väljs;
• Analog är en mer avancerad version av den monokromatiska kretsen. I det här fallet är nyanser av samma färg belägna på ett visst avstånd.

Implementeringen av alla dessa scheman presenteras väl inom paletton.com-tjänsten. Det låter dig enkelt välja en harmonisk färg.

Minecraft-koder färger, eller Minecraft koder formatering, tillåt vilken spelare som helst att lägga till blommor och formatera text på alla möjliga sätt direkt i Minecraft. Färgkoder från &0-9 - till &a-f. Lägg till dem före din text. Meddelanden från spelare kan innehålla färgkoder, som låter dig lägga till färg till dina meningar.

Färger och formateringskoder

Et-tecken (&) följt av ett hexadecimalt tal i meddelanden signalerar klienten att byta färg när text visas. Dessutom kan text formateras med en & följt av en bokstav. Du kan lägga till olika färger i böcker, kommandoblock, servernamn, serverbeskrivning (motd), världsnamn, tecken och till och med spelarnamn.

Det är väldigt enkelt att formatera din text i konfigurationer eller i spel med hjälp av färgkartan nedan. &r används för att återställa alla koder, dvs. &mAAA&rBBB kommer att visas som AAA BBB.

Vi presenterar en tabell över befintliga färgkoder i Minecraft för din bekvämlighet:

Koda	namn	Tekniskt namn	Symbol färg				Symbol skugga färg
			R	G	B	Hex	R	G	B	Hex
&0	Svart	svart	0	0	0	000000	0	0	0	000000
&1	Mörkblå	mörkblå	0	0	170	0000AA	0	0	42	00002A
&2	Mörkgrön	mörkgrön	0	170	0	00AA00	0	42	0	002A00
&3	Mörk blågrön	dark_aqua	0	170	170	00 AAA	0	42	42	002A2A
&4	Mörkröd	mörkröd	170	0	0	AA0000	42	0	0	2A0000
&5	Mörklila	mörklila	170	0	170	AA00AA	42	0	42	2A002A
&6	Guld	guld	255	170	0	FFAA00	42	42	0	2A2A00
&7	Grå	grå	170	170	170	AAAAAA	42	42	42	2A2A2A
&8	Mörkgrå	mörkgrå	85	85	85	555555	21	21	21	151515
&9	Blå	blå	85	85	255	5555FF	21	21	63	15153F
&a	Grön	grön	85	255	85	55FF55	21	63	21	153F15
&b	Blå grön	aqua	85	255	255	55FFFF	21	63	63	153F3F
&c	Röd	röd	255	85	85	FF5555	63	21	21	3F1515
&d	Ljuslila	ljuslila	255	85	255	FF55FF	63	21	63	3F153F
&e	Gul	gul	255	255	85	FFFF55	63	63	21	3F3F15
&f	Vit	vit	255	255	255	FFFFFF	63	63	63	3F3F3F

Ibland är det nödvändigt understryka, stryka över, markera vilken text som helst. Detta görs med hjälp av textformatering. Det används på exakt samma sätt som färger (vi sätter före texten koda, till exempel &lMinecraft = Minecraft.

För din bekvämlighet finns nedan en tabell med formateringskoder:

Koda	namn
&k	Magisk text
&l	Miniatyr
&m	Genomstruken text
&n	Understruken text
&o	Kursiv text
&r	Text utan formatering

CSS förstås inte). Därför behöver den framtida webmastern helt enkelt studera HTML-verktyg, som låter dig ändra färg, till exempel för att göra ljusa och färgglada e-postnyhetsbrev som ska dra till sig uppmärksamhet målgrupp webbplats.

Det här inlägget visade sig vara ganska omfattande, men från det kommer du att lära dig om alla tekniska funktioner för att arbeta med färg när HTML-hjälp. Vi börjar inspelningen med att förstå frågan: varför behöver vi markera vissa element med färg? HTML-sidor. Sedan ska vi prata om RGB-modellen, som låter dig ställa in färger i HTML med hjälp av speciella koder (på vägen ska vi titta på decimalkoder färginställningar och hexadecimala värden HTML-färg ov). Även från det här inlägget kommer du att lära dig om färgpaletten, och också förstå varför det inte finns någon palett i HTML. Och i slutet av denna publikation kommer det att finnas exempel på att ändra bakgrundsfärg, text och länkar.

Använda färger i HTML

Webbsidor skulle vara tråkiga och ointressanta utan bilder, som vi pratat om tidigare och mycket detaljerat. Men bilder har en betydande nackdel: varje bild är en extra och följaktligen en extra belastning på värdskapet.

Jag noterar att för att designa din WordPress blogg Jag använde inte en enda bild, layouten var helt designad med färg. Precis likadan Idag ska vi prata om färger i HTML. Färger i HTML används för olika ändamål, till exempel kan vi designa webblayouter genom att markera vissa objekt med en eller annan färg.

Med hjälp av färg kan vi fokusera våra besökares uppmärksamhet på en viss text eller block på webbplatsen. Observera att det också bestäms med hjälp av färg på ett sådant sätt att användaren kan förstå: vilken länk han redan har klickat på, vilken länk han ännu inte har besökt och vilken HTML-sida han är på. det här ögonblicket.

Var försiktig använda färger för att HTML design dokument, alla färger går inte ihop och alla färger kommer inte att vara tilltalande för dina webbplatsbesökare. Men det är bäst att du frågar webbdesigner om dessa finesser, den här artikeln hjälper dig att ta reda på det tekniska funktioner, så att du kan styra färgen på HTML-sidelement.

Men du bör inte glömma att designen ska separeras från innehållet, så det är bättre att använda CSS för att manipulera färg på HTML-sidor, men vi kommer att prata om detta i ett annat inlägg. Nu får vi se Vilka verktyg har HTML för att kontrollera färg på webbplatssidor?.

Inom IT-branschen finns det många färgmodeller för färgmanipulation. Den mest använda färgrepresentationsmodellen är RGB-modellen. Vi kommer att prata om några av funktionerna i denna modell här, och det kommer att finnas en separat publikation för en mer detaljerad introduktion till RGB. Nedan hittar du en lista över färgmodeller som används inom IT (inte bara HTML och CSS):

1. RGB-modell. Denna modell har blivit mycket utbredd och är kanske en av de mest bekväma och vanliga metoderna för färgmanipulation HTML-element.
2. Modell RGBA. Denna modell är väldigt lik RGB-modellen, men inkluderar en alfakanal för färgen. Det speciella med RGBA-modellen är att den låter dig justera inte bara färgen på HTML-elementet, utan också dess transparens på grund av närvaron av en alfakanal. RGBA-modellen lades till i CSS3 och stöds inte av äldre webbläsare.
3. Modell HSL. Det speciella med HSL-modellen är att vi ställer in färgen med dess parametrar: nyans, planhet och ljushet. Denna modell är något svårare att förstå än RGB-modellen.
4. Modell HSLA. Denna modell är väldigt lik HSL-modellen, men precis som RGBA-modellen låter den dig arbeta med alfafärgskanalen, så med HSLA kan vi ställa in inte bara färgen på ett HTML-element på sidan, utan också dess transparens .
5. Modell HSV (HSB). Denna modell ska inte förväxlas med HSL-modellen. Observera att de fyra första modellerna kan användas i HTML eller CSS för att designa webbsidor, men HSV-modellen kan inte. HSV designades av en av grundarna av Pixar 1978 och är mycket lik HSL.
6. Modell CMY eller CMYK. Denna modell används i alla färgskrivare för utskrift. CMYK-modellen bygger på regeln att utskrift sker på vita pappersark. Vilken CMYK-färg som helst erhålls genom att blanda cyan (blekblå, turkos), magenta (magenta) och gul. Varje färg i CMY-modellen har en opacitetskarakteristik (mängd bläck), mätt i procent. Men förutom de tre listade färgerna använder CMYK-modellen även svart.

Alla ovanstående färgmodeller är hårdvaruberoende, det vill säga om du ställ in färgen på ett HTML-element med RGB- eller HSL-modellen, då är det omöjligt att med säkerhet säga vilken exakt färgnyans en besökare på din webbplats kommer att se, eftersom monitorerna för alla användare är olika och de förmedlar färger på olika sätt. Observera också att alla ovanstående modeller är baserade på RGB-modellen och alla färger som anges i någon av modellerna (förutom HSLA och RGBA på grund av närvaron av en alfakanal) kan konverteras till RGB.

Om vi ​​talar om hårdvaruoberoende färgöverföringsmodeller är det värt att notera LAB-modellen. Så vi tog en liten paus från att arbeta med färg i HTML genom att bekanta oss med några färgmodeller. Observera att webbläsare bara "förstår" de fyra första modellerna: HSL, RGB, HSLA och RGBA. Därför kan vi bara styra färgen på HTML-element med dessa modeller.

Hur färgen på ett HTML-element bildas: några funktioner i RGB-modellen

Låt oss ta reda på det hur färgen på ett HTML-element bildas och med några funktioner i RGB-modellen. Observera att vi kommer att prata om RGB-modellen, såväl som andra modeller som används för att designa webbsidor, lite senare i separata inlägg.

Så RGB-modellen står för Red, Green, Blue. RGB-modellen bygger på principen om additivitet. Denna princip är att för att få vilken färg som helst, läggs färg till svart. För bättre förståelse föreställ dig att din skärm är en svart vägg och du har tre strålkastare: den första lyser rött, den andra lyser grönt och den tredje lyser blått. Du kan justera ljusstyrkan för varje spotlight med hjälp av en linjal med siffror från 0 till 255. Följaktligen, om du ställer in spotlighten på noll, släcks den och lyser inte om värdet är 255, då producerar spotlighten den ljusaste färgen .

Således visar det sig att om du lyser en röd och en grön spotlight på samma punkt, kommer du att märka på en svart vägg gul fläck. Om du kombinerar rött och blått får du lila, och om du kombinerar grönt och blått blir ljuspunkten på en svart vägg Cyan, men om du riktar alla tre strålkastarna mot en punkt blir ljuspunkten vit.

Principen som beskrivs ovan ligger till grund för RGB-modellen och används för att manipulera färger i HTML-element på en sida i en webbläsare.

HTML-attribut för att ändra färg på element: bakgrundsfärgen på elementet och färgen på texten inuti elementet

Används för att göra sidelement unika. Med HTML-attribut kan vi manipulera färgen på element:

1. HTML-attributfärg. Detta attribut låter dig ändra färgen på texten inuti HTML-elementet. Attributet kan ta värden i form av HTML-färgnamn och RGB-modellkoder i hexadecimala och decimala notationer. Color-attributet är ett unikt HTML-attribut som låter dig ändra färgen på text inuti vissa HTML-element.
2. HTML-textattribut. Det här attributet är ett unikt taggattribut . Märka tillsammans med taggar Och form . Om du kommer ihåg, inuti behållaren element placeras som sedan visas av webbläsaren i visningsområdet. Textattributet låter dig specificera Standardtextfärg för hela HTML-sidan.
3. HTML-attribut bgcolor. Det är också ett unikt HTML-attribut och låter dig ändra bakgrundsfärgen för vissa HTML-element.
4. HTML-attribut vlink. Det här attributet är unikt och gäller endast för taggen för att ändra färgen på en länk som användaren redan har besökt.
5. HTML-attribut alink. Detta attribut är också unikt och gäller bara för taggen . Alink-attributet ändrar färgen på den aktiva HTML-länkar.
6. HTML-länkattribut. Länkattributet används endast i kombination med en tagg och tjänar till att ändra färgen på HTML-sidlänkar som användaren ännu inte har besökt.

Observera: att använda attribut för att ändra färgen på HTML-element rekommenderas inte, eftersom det finns överlappande stilmallar som låter dig separera designen på en webbsida från dess innehåll.

Använda decimalfärgskoder i HTML

Så vi pratade om det faktum att du kan ställa in ljusstyrkan på strålkastarens färg med en speciell linjal på vilken det finns numrerade ritningar från 0 till 255. Låt oss nu se hur detta kommer att hjälpa oss att ändra färgen på HTML-element. Saken är att vi kan ändra färgen på texten inuti ett HTML-element eller bakgrundsfärgen i HTML med hjälp av decimalkod enligt följande:

Om du skapar ett HTML-dokument där kroppsbehållaren beskrivs, som i exemplet, kommer du att se:

1. Färg HTML bakgrund dokument blev grönt: bgcolor="rgb (0,255,0)".
2. Färg HTML-text sidan blir blå: text="rgb (0,0,255)".
3. HTML-färgen på en länk som användaren inte har besökt kommer att vara vit: link=”rgb (255,255,255)”.
4. Färgerna på länken som för närvarande är öppen kommer att vara svarta: alink="rgb (0,0,0)".
5. Och färgen på HTML-länken som redan har besökts kommer att vara röd: vlink=”rgb (255,0,0)”.

Observera: ingen förbjuder dig att justera "spotlight power" efter eget gottfinnande, det kan du ställ in HTML-färg till exempel så här:

rgb(94, 85, 50)

Och få färgen av barnslig överraskning. Detta är egenheten, flexibiliteten och bekvämligheten med RGB-modellen. Din bildskärm är en svart vägg med spotlights som lyser på den, och du kan justera kraften hos dessa spotlights och skapa alla typer av bakgrundsfärger, text och länkar med HTML-attribut i decimalnotationssystemet, eller, du kan också säga: med hjälp av decimala färgkoder.

Faktiskt Det är fel att säga decimala färgkoder i HTML, vore det mer korrekt att säga decimalkoder RGB-färger , eftersom den den här modellen Det används inte bara för att designa webbsidor i HTML och CSS.

Hexadecimala HTML-färgvärden

Att ställa in färgen på HTML-element med decimalkoder av RGB-modellen är inte särskilt bekvämt (och för närvarande stöder inte alla webbläsare denna metod för färgmanipulation), eftersom inspelningen inte kommer att vara den mest kompakta ställ in färgen på HTML-element med hexadecimala värden. I bilden nedan kan du se hur decimalvärden konverteras till hexadecimala.

För den som inte är bekant med det hexadecimala talsystemet bör en liten förklaring ges så att du enkelt kan manipulera färgen på HTML-element med hjälp av hexadecimala RGB-modellkoder. För det första heter decimaltalsystemet så eftersom vilket tal som helst kan erhållas genom en kombination av tio siffror (terminologin är viktig: det är skillnad mellan ett tal och en siffra): 0, 1, 2, 3, 5, 6, 7, 8, 9.

I det hexadecimala talsystemet kan vilket tal som helst skrivas med en kombination av sexton siffror: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, a, b, c, d, e, f. För att underlätta förståelsen kan du anta att a är tio och f är femton. Till exempel skulle talet sexton skrivas hexadecimalt enligt följande: 10. Och talet 255 skulle skrivas som ff.

Låt oss nu se hur vi kan ställ in färgen på HTML-element med hexadecimala värden, låt oss upprepa vårt tidigare exempel och ersätta decimalfärgkoderna med deras hexadecimala motsvarigheter:

< body alink = ”#000000” link=”#ffffff” vlink=”ff0000” bgcolor=”#00ff00” text=”#0000ff”>

Notera: att skriva färg i HTML i hexadecimalt format är något mer kompaktän i decimal, det är den första. För det andra: styrkan för varje spotlight ställs in av siffror från 0 till 255. För att skriva talet 255 krävs två siffror i hexadecimalt format (ff = 250), så ljusstyrkan för varje färgkanal (våra spotlights kallas korrekt för färgkanalen, färgkanal) ställs in med två siffror från 0 till f.

Observera: ljusstyrkan för varje färgkanal ställs in separat, men om vi föreställer oss att detta är ett enda nummer, då är det maximalt möjliga antalet i RGB-modellens hexadecimala talsystem ffffff, det kommer att ge oss vit färg, och i decimalsystemet är det: 16 777 215. Detta antal färger och nyanser låter dig ställa in/använda RGB-modellen. Detta nummer erhålls från det faktum att varje färgkanal det finns 256 ljusstyrkavärden (från 0 till 255), respektive: 256*256*256 = 16,777,215.

Hexadecimala HTML-färgvärden är mer kompakta och tydligare, de flesta webbdesigners och layoutdesigners använder hexadecimala värden för att manipulera färg i HTML, så vi rekommenderar att du inte vänjer dig vid decimalformen av färgnotation, utan omedelbart använder hexadecimal.

Det är klart att det till en början kommer att vara svårt för en nybörjardesigner eller layoutdesigner att navigera i den hexadecimala formen av inspelningsfärg, så nästan alla grafiska redigerare har en så kallad färgpalett, som låter dig välja önskad färg och få sin kod för olika färgmodeller i olika system Beräkning.

Vissa textredigerare, till exempel , har paletttillägg som är väldigt praktiska när du snabbt vill välja en färg och ändra den. Jag kan inte säga något om detta i detta avseende.

Färgnamn i HTML

HTML-attribut kan ta som värde inte bara decimalkoder och hexadecimala värden, men också speciella blomnamn. Att ändra färgen på HTML-element med hjälp av dess namn är inte en bra idé. För det första, bakom färgnamnet i HTML ligger RGB-modellkoden, och för det andra visar varje webbläsare färgen på HTML-elementet som anges av namnet annorlunda, det beror bara på webbläsarutvecklarnas önskemål.

Det är därför att använda ett färgnamn i HTML rekommenderas inte. RGB-modellen är hårdvaruberoende, och färgen som anges av namnet beror på webbläsaren och till och med dess version. Låt oss försöka ställa in färgen på HTML-sidans element med hjälp av namnet:

< body alink = ”black ”link = ”#white” vlink=”röd” bgcolor=”grön” text=”blå”>

Som du förstår finns det många färger och nyanser. Det är värt att notera här att HTML-attribut inte tillåter dig att ställa in en gradient CSS har det här alternativet, men vi kommer att prata om det i ett annat inlägg. Och många färger i HTML har namn. Tabell med namn på färger i HTML och deras RGB-koder du hittar den på min hemsida.

Tabellen ovan visar vilken färg HTML-elementet får om du anger det med namnet. Den här tabellen innehåller 16 färger och deras namn som är godkända av W3C och bör visas på samma sätt i alla webbläsare. Men faktiskt, i HTML kan du använda cirka 200 färgnamn som stöds av stora webbläsare, såsom: Opera, Chrome, Firefox, Safari, Internet Explorer (detta uttalande är mycket kontroversiellt om det senare).

HTML färgpalett

Faktiskt det finns ingen färgpalett i HTML. Låt oss komma ihåg definitionen av ordet palett. En palett är en liten tunn skiva av fyrkantig eller oval form på vilken konstnären blandar färger och får fram alla möjliga färger. Ibland görs ett hål i paletten för tumme så att den är bekväm att hålla i. Du hittar en bild av paletten nedan. Det är därför det inte finns någon palett i HTML.

Men i olika textredigerare Det finns plugins för färgpalett som hjälper välj snabbt färgen på ett HTML-element. Det finns även en färgpalett i grafiska redaktörer, för det är inte särskilt bekvämt och roligt för en designer att sitta och beräkna: vilken färg kommer ut vid den här eller den ljusstyrkan på den här eller den kanalen. På bilden nedan kan du se den enklaste paletten i Paint-redigeraren.

Observera att många färgpalettmoduler och plugins låter dig få en färgkod inte bara i RGB/RGBA-formatet, utan även i formatet för andra modeller. Kom ihåg att det inte finns någon palett i HTML, ja, om du inte är en artist till kärnan och du kallar HTML-sidans färgpalett för dessa färger som användes för att dekorera den (trots allt, ibland hänvisar en palett till färgerna som en viss konstnär använder, eller de färger som användes vid skapandet av en viss målning).

Lär dig ändra textfärg i HTML

Vi har mycket teori om färger i HTML, låt oss träna och prova arbeta med färger på HTML-element. Det första vi kommer att lära oss att göra är ändra textfärg HTML-dokument med hjälp av speciella attribut och taggar. Öppna valfri editor och skriv följande kod i den:

Lär dig arbeta med färg i HTML

Ändra textfärg

För att ändra färgen på texten kan vi använda det unika attributet för BODY-textelementet, och vi kan också använda FONT-elementet och dess färgattribut. Denna text kommer att vara nedtonad.

< ! DOCTYPE html > < html lang = "ru-RU" > < head > < meta charset = "UTF-8" > < title >Ändra färgen på texten i HTML-dokumentet< / title > < link rel = "stylesheet" type = "text/css" href = "style.css" / > < / head > < body text = "#ff0000" > < h1 > < font color = "rgb(0,255,0)" >Lär dig arbeta med färg i HTML< / font > < / h1 > < h2 > < font color = "yellow" >Ändra textfärg< / font > < / h2 > < p >För att ändra textfärgen kan vi använda en unik elementets BODY text-attribut, och använd även FONT-elementet < / body > < / html >

Jag kommer att spara den här filen som color.html och råder dig att inte glömma . Att spela in färg i decimalsystemet stöds inte av Chrome, Firefox och Opera, men IE förstår denna färgnotation och markerar HTML-huvudet i grönt:

Det korrekta att säga är att inte ändra textfärgen i HTML, utan att ändra teckensnittsfärgen i HTML. Handla om

I HTML kan färg anges på tre sätt:

Ange en färg i HTML efter dess namn

Vissa färger kan specificeras med deras namn, med hjälp av färgnamnet på engelska språket. Den vanligaste nyckelord: svart (svart), vit (vit), röd (röd), grön (grön), blå (blå), etc.:

Textfärg – röd

De mest populära färgerna i Consortium-standarden World Wide Web(eng. World Wide Web Konsortium, W3C):

Färg	namn	Färg	namn	Färg	namn	Färg	namn
	Svart		grå		Silver		Vit
	Gul		Kalk		Aqua		Fuchsia
	Röd		Grön		Blå		Lila
	Rödbrun		Oliv		Marin		Kricka

Exempel på användning av olika färgnamn:

Exempel: ange en färg med dess namn

• Prova själv "

Rubrik på röd bakgrund

Rubrik på orange bakgrund

Rubrik på lime bakgrund

Vit text på blå bakgrund

Rubrik på röd bakgrund

Rubrik på orange bakgrund

Rubrik på lime bakgrund

Vit text på blå bakgrund

Ange färg med RGB

Vid visning av olika färger på en bildskärm används RGB-paletten som bas. Vilken färg som helst erhålls genom att blanda tre grundläggande färger: R - röd, G - grön, B - blå. Ljusstyrkan för varje färg ges av en byte och kan därför ta värden från 0 till 255. Till exempel visas RGB(255,0,0) som rött eftersom rött är satt till sitt högsta värde (255) och resten är inställda på 0 Du kan också ställa in färgen i procent. Varje parameter indikerar ljusstyrkan för motsvarande färg. Till exempel: värdena rgb(127, 255, 127) och rgb(50%, 100%, 50%) kommer att ställa in samma grön färg medium mättnad:

Exempel: Ange färg med RGB

• Prova själv "

rgb(127, 255, 127)

rgb(50 %, 100 %, 50 %)

rgb(127, 255, 127)

rgb(50 %, 100 %, 50 %)

Ställ in färg med hexadecimalt värde

Värderingar R G B kan också specificeras med hexadecimala (HEX) färgvärden i formen: #RRGGBB där RR (röd), GG (grön) och BB (blå) är hexadecimala värden från 00 till FF (samma som decimal 0-255) ) . Hexadecimalt system, i kontrast decimalsystem, bygger, som namnet antyder, på siffran 16. Det hexadecimala systemet använder följande tecken: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F Här ersätts siffrorna 10 till 15 med latinska bokstäver. Tal större än 15 i det hexadecimala systemet representeras genom att kombinera två tecken till ett värde. Till exempel, det största antalet 255 i decimal motsvarar det högsta FF-värdet i hexadecimal. Till skillnad från decimalsystemet, innan hexadecimalt tal sätta en hash-symbol # , till exempel, #FF0000 visas som rött eftersom rött är inställt på sitt högsta värde (FF) och resten av färgerna är inställda på lägsta värde(00). Tecken efter hash-symbolen # Du kan skriva med både stora och små bokstäver. Det hexadecimala systemet låter dig använda den förkortade formen #rgb, där varje tecken motsvarar dubbelt. Därför bör posten #f7O betraktas som #ff7700.

Exempel: HEX-färg

• Prova själv "

röd: #FF0000

grön: #00FF00

blå: #0000FF

röd: #FF0000

grön: #00FF00

blå: #0000FF

röd+grön=gul: #FFFF00

röd+blå=lila: #FF00FF

grön+blå=cyan: #00FFFF

Lista över vanliga färger (namn, HEX och RGB):

engelskt namn	ryskt namn	Prov	HEX	RGB
Amaranth	Amaranth		#E52B50	229	43	80
Bärnsten	Bärnsten		#FFBF00	255	191	0
Aqua	Blå grön		#00FFFF	0	255	255
Azurblå	Azurblå		#007FFF	0	127	255
Svart	Svart		#000000	0	0	0
Blå	Blå		#0000FF	0	0	255
Bondi blå	Bondi strandvatten		#0095B6	0	149	182
Mässing	Mässing		#B5A642	181	166	66
Brun	Brun		#964B00	150	75	0
Cerulean	Azurblå		#007BA7	0	123	167
Mörk vårgrön	Mörk vårgrön		#177245	23	114	69
Smaragd	Smaragd		#50C878	80	200	120
Äggplanta	Äggplanta		#990066	153	0	102
Fuchsia	Fuchsia		#FF00FF	255	0	255
Guld	Guld		#FFD700	250	215	0
grå	Grå		#808080	128	128	128
Grön	Grön		#00FF00	0	255	0
Indigo	Indigo		#4B0082	75	0	130
Jade	Jade		#00A86B	0	168	107
Kalk	Kalk		#CCFF00	204	255	0
Malakit	Malakit		#0BDA51	11	218	81
Marin	Mörkblå		#000080	0	0	128
Ockra	Ockra		#CC7722	204	119	34
Oliv	Oliv		#808000	128	128	0
Orange	Orange		#FFA500	255	165	0
Persika	Persika		#FFE5B4	255	229	180
Pumpa	Pumpa		#FF7518	255	117	24
Lila	Violett		#800080	128	0	128
Röd	Röd		#FF0000	255	0	0
Saffran	Saffran		#F4C430	244	196	48
Havsgrön	Grönt hav		#2E8B57	46	139	87
Träskgrönt	Bolotny		#ACB78E	172	183	142
Kricka	Blå grön		#008080	0	128	128
Ultramarin	Ultramarin		#120A8F	18	10	143
Violett	Violett		#8B00FF	139	0	255
Gul	Gul		#FFFF00	255	255	0

Färgkoder (bakgrund) efter mättnad och nyans.