Lekcija 7. Boje teksta i pozadine u HTML-u.

Datum: 2008-12-05

Kako postaviti boju pozadine i teksta na web stranici?

Prema zadanim postavkama, boja teksta i, općenito, bilo kojeg fonta na web stranicama je uvijek crno (#000000 ). Ali uvijek možemo postaviti apsolutno bilo koju boju koja nam se sviđa i izgleda pristojno ili je prikladnija za dizajn određene stranice.

Postavite boju teksta

U HTML-u se boja teksta, fonta, pozadine i drugih elemenata može postaviti na dva načina:

1. Metoda 1. U uparenim oznakama atribut je napisan označavajući naziv željene boje. Naziv boje je naveden na engleskom jeziku. Na primjer, boju naslova na našoj web stranici možete postaviti na sljedeći način:

Komentari na ovaj članak (lekcija):

Andrej! Kakvu divnu stranicu imate! Koristim ga redovito već drugi tjedan: proučavam vaše lekcije i video tutorijale; Čitam vašu literaturu i preuzimam programe; Radim prve korake u web programiranju! I što je najvažnije, ja to mogu!!! Ali ja uopće nisam fizičar, nego tekstopisac! A u ovo se može uvjeriti svatko tko posjeti moju književnu web stranicu: “PJESME OLEG GUZ” Moji podaci: email: STIH [e-mail zaštićen] web stranica: http://sites.google.com/site/stihiolegguz/

pažljivo provjerite šifru

Pokušao sam promijeniti boju pozadine i ne ide! Kako promijeniti boju pozadine?

Kako promijeniti boju fonta u html

Ako imate ikakvo znanje o web tehnologijama, trebali biste znati da su sve oznake i sadržaj dokumenta sadržani u html datoteci, a datoteka css stilova pohranjuje stilove koji određuju izgled različitih elemenata. Dakle, css je taj koji trebamo koristiti za promjenu boje fonta i svega ostalog.

U html-u postoje oznake koje vam omogućuju primjenu određenih efekata na tekst, ali morate priznati da izmišljanje stotina oznaka za svaku nijansu ne bi bilo sasvim razumno. U css-u to možete kontrolirati mnogo praktičnije. Na primjer, tako možete postaviti boju fonta za html body element, odnosno tag koji uključuje cijeli sadržaj stranice koja se prikazuje na ekranu.

tijelo (boja: crvena; )

Tijelu stranice smo dodijelili crvenu boju. Odlomci, popisi, naslovi i svi ostali elementi će ga dobiti. To će se događati dok se stilovi za ove elemente ne redefiniraju za druge.

Formati snimanja u boji

Možda imate neko znanje o web dizajnu? U ovom slučaju, trebali biste znati da postoje različiti načini boja. Na primjer, rgb, rgba, hsl, hex, itd. Naravno, najlakši način da postavite ton je jednostavno napisati ključnu riječ. To smo učinili u gornjem primjeru, vrijednost crvena čini slova crvenima, plava – plavim, smeđa – smeđim. Ovo su samo imena cvijeća na engleskom.

Jedino što u ovom slučaju trebate znati je naziv željene boje. Možete ih pogledati na internetu u bilo kojoj tablici. Sljedeći popularan način određivanja boje je zapisivanje njenog heksadecimalnog koda. Ovo je takozvani hex format. Primjeri:

p( color: #000; ) /* Tekst u odlomcima bit će crn. */ table( color: #fff; ) /* Sadržaj u tablicama bit će bijele boje. */

Kao što vidite, morate zapisati mrežu, a zatim šifru boje. Kako ga prepoznati? Na primjer, možete otvoriti Photoshop ili bilo koji drugi grafički uređivač, u kojem se pri odabiru boje prikazuje njezin heksadecimalni kod. Također možete koristiti online uslugu.

RGB je još jedan popularan format snimanja. To jednostavno označava crveno, zeleno, plavo. Boja u ovom formatu postavljena je ovako:

#footer(boja: rgb(234, 22, 56); )

Element s podnožjem ID-a dobit će navedenu boju. Udio crvene boje bit će 234, zelene - 22, plave - 56. Ove vrijednosti mogu se napisati od 0 do 255. Prema tome, naša će sjena biti bliža crvenoj. U programu Paint možete dodati boje svojoj paleti mijenjanjem zasićenosti triju primarnih boja.

Prednost ove metode je što možete birati između milijuna boja samo promjenom tri broja. Kada pišete koristeći ključne riječi, imat ćete samo nekoliko stotina boja u svom arsenalu.

Rgba - proziran tekst!

Da, ovo je novi način snimanja koji je već dugo dostupan u grafičkim urednicima, ali se relativno nedavno pojavio u web dizajnu. Napisano je ovako:

a(rgba(255, 12, 22, 0,5); )

Zadnji broj u unosu postavlja prozirnost. Može se pisati od 0 do 1, gdje je 1 potpuno neproziran tekst, odnosno zadano ponašanje. U tom će slučaju svi linkovi postati crveni, ali će zbog prozirnosti svjetlina boje biti puno manja, a ako se ispod linka nalazi neka druga pozadina ili element, bit će vidljiv.

Pogrešan način postavljanja boje

HTML ima zastarjeli atribut boje i može se koristiti za bilježenje boje teksta pomoću ključne riječi. Sada ovo možda neće raditi ni u modernim preglednicima, a općenito ova metoda krši općeprihvaćene web standarde. I to je također nezgodno.

Kako odrediti boju za proizvoljni fragment

U redu, govorimo o boji fonta za odlomke, poveznice i tablice, ali to su solidni elementi, ali što ako ipak trebate definirati boju za jednu rečenicu, jednu riječ, jedno slovo?

Jednostavno prilažemo željeni fragment u span oznake. Unutar oznake upišemo atribut klase kojemu postavimo proizvoljnu, ali razumljivu vrijednost. Na primjer, ovako:

To je to, sada ostaje još samo pristupiti selektoru u css-u.

Prilikom izrade web stranice morate se suočiti s raznim dizajnerskim izazovima. Jedno od čestih pitanja je kako promijeniti boju teksta u HTML-u. Rješavanje je vrlo jednostavno, a postoje dva različita načina.

Postavljanje atributa stila umetnutog teksta

Da biste razumjeli kako promijeniti boju teksta u HTML-u, samo pogledajte popis atributa tekstualnog polja. Među njima postoji niz vrijednosti koje određuju stil teksta unutar ovih oznaka, a koje su navedene unutar ključne riječi style.

Da biste promijenili boju teksta, jednostavno unesite riječ style= "" u odabrano područje tekstualnog polja unutar početne oznake. Unutar ovog atributa možete odrediti različite vrijednosti parametara - vrijednost atributa boje je odgovorna za promjenu tona boje teksta. Određivanjem ovog parametra, nakon znaka dvotočke morate navesti boju kojom će svi znakovi u ovom polju biti obojeni. U ovom slučaju, kada definirate nijansu, možete navesti i eksplicitnu vrijednost boje, na primjer, crvenu ili žutu, i njezinu heksadecimalnu vrijednost ili rgb.

Bez obzira na odabranu metodu određivanja boje, rezultat će biti isti ako je nijansa odabrana na isti način. Stoga će sva sljedeća tri primjera unijeti iste promjene u tekst - obojiti ga u žuto.

1.

tekst

2.

tekst

3.

tekst

Promjena boje pomoću CSS-a

Korištenje lista stilova također vam omogućuje da odlučite kako promijeniti boju teksta u HTML-u. CSS u potpunosti podržavaju sve moderne verzije HTML-a, a također vam omogućuje promjenu stila nekoliko elemenata stranice odjednom.

Da biste razumjeli kako promijeniti boju teksta u HTML-u pomoću CSS-a, ne morate razumjeti formalni jezik izgleda. Za definiranje atributa određenog elementa potrebno je kreirati CSS opis koji je napisan unutar taga , a definiran je oznakom