Html farger | RGB, Hex, HSL forklarte
Denne oppskrivningen vil demonstrere hvordan du legger til farger i et HTML-element/dokument. Det vil gi en generell oversikt over grunnleggende fargekonvensjoner som "fargenavn", "RGB -verdier", "Heksadesimale verdier" osv. Så la oss starte!
HTML fargenavn
Den første måten å implementere HTML -farger er å bare bruke fargenavnet i.e. Engelske ord for fargen som grønn, gul, rød osv. HTML støtter mer enn hundre standardfargens navn.
Eksempel
Anta at vi har et avsnitt i HTML:
En paragraf
For å gi den en farge, la oss si grønn, vi kan gjøre dette:
En paragraf
HTML heksadesimal farge
HTML støtter en annen måte å legge til farger i.e. de heksadesimale verdiene. Heksadesimale verdier kan skrives ved hjelp av seksten sifre 0-9 og A-F. Det bestemmes av en "#”Symbol etterfulgt av tre eller seks sifre. For eksempel: #RRGGBB. Her representerer de to første sporene rødt, de tilstøtende to sporene viser grønne, og de to siste viser blå verdi.
Eksempel
Anta at vi har et avsnitt i HTML:
En paragraf
Denne gangen vil vi prøve å sette bakgrunnsfargen på
Tag til grå ved hjelp av heksadesimale verdier, og vi kan gjøre dette ved hjelp av følgende linje HTML -kode:
En paragraf
I koden ovenfor er “#E3E3E3” HEX Code of Grey Color.
Heksadesimale verdier kan skrives ved hjelp av bare tre sifre i stedet for seks sifre. For eksempel den heksadesimale verdien #F00 vil produsere samme farge som #FF0000.
HTML RGB -farger
En annen mest brukt metode for farger er RGB -verdier. Det tar tre verdier i.e. rød, grønn og blå. I stedet for å bruke de rare heksadesimale tallene, bruker RGB -egenskapen tall fra 0 til 255. Disse tallene bestemmer intensiteten til hver fargeparameter, for eksempel for å bruke den svarte fargesett alle parametere til 0 i.e. RGB (0, 0, 0). RGB (0, 0, 255) vil vise den blå fargen og så videre.
Eksempel
La oss vurdere det samme avsnittet:
En paragraf
Nå vil vi prøve å stille bakgrunnsfargen til oransje ved hjelp av RGB -verdier, og vi kan gjøre dette ved hjelp av følgende linje HTML -kode:
En paragraf
I koden ovenfor er “RGB (255, 165, 0)” RGB -verdiene for oransje farge.
HTML RGBA -farger
RGBA -verdiene er en utvidelse av RGB -fargeverdier der "EN”Representerer alfa -kanalen som spesifiserer opaciteten for en farge. En alfa -parameter er et tall mellom 0 (gjennomsiktig) og 1 (ugjennomsiktig).
Eksempel
Dette eksemplet viser hvordan alfa -parameteren “EN”Vil bli spesifisert:
En paragraf
Den ovennevnte koden implementerte alfa-parameteren på
element. Nå vil resultatet være i henhold til mengden gjennomsiktighet som vist i følgende utgang:
HTML HSL -farger
HTML gir en annen fargekonvensjon i.E HSL bestemmer en farge med fargetone, metning og lys. Eventuelt kan det også ha en alfa -parameter.
- Begrepet fargetone bestemmer en engel i fargehjulet e.g. 0 eller 360 grader representerer rød farge, på samme måte er gjenværende farger separert rundt sirkelen. Grønt tilsvarer for eksempel 120 grader, cyan tilsvarer 180 grader, og så videre.
- Mens den andre verdien i HSL er metning som bestemmer fargenes intensitet og er representert med et % tegn.
- Den tredje verdien er letthet som bestemmer lyshetsnivåene som er representert med % tegnet.
For eksempel betyr hundre prosent full lys i.e. Hvit mens null prosent betyr ikke noe lys jeg.e. svart, og så videre.
Eksempel
Det undergitte skriptet vil implementere HSL-fargekonvensjonen om forskjellige HTML-elementer:
En paragraf
Vi får følgende utdata for ovennevnte kode:
Konklusjon
HTML gir flere fargekonvensjoner for å angi tekstfarge, bakgrunnsfarge osv. Det er fire måter å fargelegge et HTML -element: fargetavn, RGB -verdier, heksadesimale verdier og HSL -verdier. For å stille inn fargen ved hjelp av "fargenavn" spesifiser navnet på fargen i.e. rødgrønn. For RGB, kombiner fargeverdier rød, grønn og blå mellom 0 til 255. For heksadesimal farge skriv tre eller sekssifret fargekode. For HSL, sett verdiene til fargetone, metning og lys.