Tutorial HTML - Coduri de culori

Tutoriale CSS si HTML, tutoriale editare si instalare site-uri in CSS si HTML!
Avatar utilizator
DarkArms
Membru
Mesaje: 3107
Localitate: Reșița, România
Nick server: cleks
Contact:

Tutorial HTML - Coduri de culori

Mesaj de DarkArms » Sâm Iul 08, 2017 2:26 pm

Exista trei feluri distincte de a defini o culoare. Cea mai simpla metoda este aceea de a numi culorile (in engleza). De exemplu: black, white, red, green, si blue. Am alaturat mai jos numele de culori care sunt suportate in HTML.

HTML - Sistemul de culori RGB

Cu ceva vreme in urma, Internet explorer era singurul browser care avea suport pentru sistemul de culor RGB. In ziua de astazi, toate browserele cunoscute, ofera suport pentru acest sitem de culori. Pe de alta parte, sistemul RGB, se foloseste foarte mult in CSS

RGB este prescurtarea pentru: Red, Green, Blue. Fiecare dintre aceste culoripoate lua orice valoare intre 0 (nu exista culoare) si 255 (in totalitate acea culoare). Am alaturat mai jos forma de scriere a culorilor in RGB. Daca folosesti un browser care nu este Internet Explorer nu vei avea nici un rezultat.

bgcolor="rgb(255,255,255)" White
bgcolor="rgb(255,0,0)" Red
bgcolor="rgb(0,255,0)" Green
bgcolor="rgb(0,0,255)" Blue

HTML - Sistemul de culori hexazecimal

Sistemul hexazecimal este destul de dificil la prima vedere. Cu toate astea te asigur ca odata cu trecerea timpului, si cu putina practica, il vei intelege pe deplin. Sistemul de culori hexazecimal este sistemul standard pentru toate browser-ele web. Este de incredere si este compatibil nu numai in aplicatiile web dar si aplicatii locale precum gimp, photoshop, corel, etc.

Sistemul coduri de culori hexazecimale este o reprezentare de 6 caractere de culoare. Primele doua caractere (RR) reprezinta culoarea rosu (Red), urmatoarele doua (GG) culoarea verde (Green), iar ultimele doua (BB) culoarea albastra (Blue).

Cod: Selectaţi tot

bgcolor="#RRGGBB"
HTML - Coduri de culoare - Ruperea codului

Tabelul urmator arata cum literele sunt integrate in sistemul hexazecimal, marind astfel posibilitatile de combinare pentru obtinerea codurilor de culori in HTML.

Zecimal
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
Hexazecimal
0 1 2 3 4 5 6 7 8 9 A B C D E F

In acest fel posibilitatile cresc iar sistemul poate avea 16 valori.

Un exemplu de cod hexazecimal ar fi:

Cod: Selectaţi tot

bgcolor="#FFFFFF"
Litera "F" este valoarea maxima pe care o poate avea sistemul. La intalnirea acestui cod un browser va afisa culoarea alba. In cazul in care vrei sa afli valoarea numerica a acestei culori avem formula urmatoare:

Cod: Selectaţi tot

(15 * 16) + (15) = 255
Formula este foarte simpla. Se ia prima valoare a lui "F" sau 15 si se inmulteste cu 16 si se adauga celei de-a doua valoare 15. Rezultatul este 255, valoarea maxima pe care o poate avea o culoare primara.

Cod: Selectaţi tot

bgcolor="#CC7005"

CC(RR - Red)
(12 * 16) + (12) = 204
70(GG - Green)
(7 * 16) + (0) = 112 
05(BB - Blue)
(0 * 16) + (5) = 5
HTML - Culori sigure

Sistemul hexazecimal este cel mai utilizal pentru crearea paginilor. Acesta este compatibil cu majoritatea browser-elor, in acest fel interfata pagini web nu va fi distorsionata. Pentru a adauga o nota de siguranta iti recomand sa folosesti culorile imperechiate (sau true colors) precum: "#0011EE", "#44HHFF", sau "#117788. Conform statisticilor acestea nu vor fi schimbate indiferent de browser.

Am alaturat mai jos un tabel cu codurile corespunzatoare acestor culori sigure.

Pentru a simplifica tabelul de mai jos am afisat culorile sigure folosind coduri scurte. Tine minte in acest sub-capitol vorbim de culori imperechiate, asa ca de exemplu culoarea reprezentata ca fiind 369 este de fapt 33 66 99 iar FFC va fi FF FF CC.

*Cele mai sigure culori HTML

Cu toate ca aceste culori sigure (true colors) de mai sus, sunt cele recomadate pentru a fi folosite de catre webmasteri, a fost demonstrat ca doar 22 dintre cele 216 culori sunt cu adevarat sigure si nu vor fi in absolut modificate in reprezentare de catre nici un monitor. In tabelul de mai sus culorile cu adevarat sigure au fost reprezentate cu un asterix ( * ) in fata.

Înapoi la “Tutoriale CSS si HTML”

Cine este conectat

Utilizatori ce ce navighează pe acest forum: Niciun utilizator înregistrat și 1 vizitator