Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

Bună ziua, astăzi vom vorbi despre cum să setăm parametrii pentru fontul de pe site-ul nostru cu ajutorul CSS care va simplifica în mod semnificativ procesul de creare a unui site. De asemenea, este de remarcat faptul că puteți schimba foarte ușor și rapid fontul nu numai pe un anumit loc și modificați complet fontul întregului site.







Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

Stilul fontului în CSS.

Pentru a seta stilul fontului în CSS, trebuie să folosim atributul font-family și să setăm unul dintre stilurile de font pentru el. Acum majoritatea oamenilor folosesc numai fonturi sigure atunci când creează site-uri. Sigure sunt fonturile disponibile în mod implicit în sistemul de operare Windows (cel mai popular sistem de operare) și, în consecință, textul dvs. va fi întotdeauna afișat corect. Permiteți-mi să listați fonturile pe care le puteți utiliza în siguranță pe site-ul dvs. sau blog. Astfel de fonturi includ:


Arial Black
Arial
Comic Sans MS
Curier Nou
Georgia
efect
Lucida Console
Lucida Sans Unicode
Linotype Palatino
Tahoma
Times New Roman
Trebuchet MS
Verdana

Dacă pentru site-ul dvs. ați ales unul dintre aceste fonturi, atunci problemele de afișare nu ar trebui să apară și toate paginile site-ului vor fi afișate corect. Permiteți-mi să folosesc un exemplu pentru a vă arăta cum puteți seta stilul de text pentru site-ul dvs.

De exemplu, să luăm același fragment din text din articolele anterioare. După cum vă amintiți din articolul precedent, cum să creați un paragraf în html, am înfășurat textul într-o etichetă de paragraf și acum trebuie doar să setăm stilul pentru paragraf. Pentru a face acest lucru, în fișierul de stil al paragrafului, asignăm parametrul stilului de text Tahoma și vom arăta cum va arăta:

După ce aplicăm acești parametri în textul nostru, puteți vedea rezultatul lucrării.

După aplicarea setărilor de stil.

Observați, de asemenea că textul este modificat numai pe punctele de site-ul nostru, titluri, liste, și așa mai departe au un font implicit și la pozițiile și liste au fost același font pe care doriți să adăugați numele lor în foaia de stil.

Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

De asemenea, puteți specifica pentru pagină nu una, ci mai multe variante de fonturi. Pentru aceasta, trebuie doar să specificați toate fonturile separate prin virgule.

Acum, să vedem cum funcționează acest lucru. Browserul citit comanda caută calculator pentru primul font specificat, în cazul în care fontul nu este prezent pe computer este în căutarea pentru următorul font, și așa mai departe până când se găsește un font sau până când enumără toate aceste fonturi. Dacă se întâmplă ca nici unul dintre fontul nu este găsit, atunci textul va fi afișat pe fontul implicit.

De asemenea, trebuie să ne amintim că, dacă numele fontului este format din două sau mai multe cuvinte pe care trebuie să semneze numele în ghilimele pentru a browser-ul să înțeleagă că acest lucru este font și un titlu de afișare a textului corect. Această situație am arătat în imaginea de mai sus și cred că veți înțelege cum să faceți acest lucru.







Dimensiunea fontului în CSS.

Să setăm acum dimensiunea fontului pe pagina noastră și, pentru aceasta, va trebui să folosim comanda pentru mărimea fontului și așa arată în practică și voi vorbi mai multe despre aplicarea acestui parametru. Să setăm textul nostru la 18 pixeli.

Acum, să vedem ce se va întâmpla după acest text.

Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

Acum, textul din pagina noastră va avea dimensiunile de 18 pixeli. Puteți seta dimensiunea nu numai în pixeli a și în procente, puncte și așa mai departe.

Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

Toate aceste dimensiuni există, dar când proiectați propriul șablon sau creați un site, veți avea nevoie doar de pixeli, toate celelalte dimensiuni fiind necesare doar dacă vă ocupați de șablonul altui utilizator. În design, numai măsurarea în pixeli este utilizată peste tot.

Evidențiați textul cu caractere aldine sau italice.

Pentru ca textul nostru să evidențieze textul cu caractere aldine, trebuie să folosim parametrul de greutate al fontului, care are parametrii îndrăzneți și normali, care corespund textului îngroșat și, respectiv, normal. Așa arată în practică.

Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

Și acum, să analizăm rezultatul aplicării acestui parametru.

Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

Dacă specificăm parametrul normal, atunci textul nostru va fi conținutul obișnuit de grăsimi. Puteți seta, de asemenea, grăsime, folosind un parametru special în format digital, în cazul în care un conținut normal de grăsime corespunde unei cifre de 400 la 700. Toate intermediar numere cresc aldine sau micșora valoarea de grăsime.

Pentru a selecta textul cu caractere cursive, trebuie să setăm proprietatea fontului: stil italic și veți selecta textul cu caractere cursive. Codul fișierului arată astfel:

Și acum să vedem rezultatul.

Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css

Decorarea textului în CSS.

Acum ne uităm la un moment atât de important ca decorarea textului cu CSS, toate aceste funcții sunt adesea folosite în proiectarea ecranului de link-uri de pe site-ul. Decorare de text în CSS se face cu ajutorul comenzii text-decor, care are patru proprietăți pun în evidență, sublinia, overline-top subliniere, linie de text-throudh-ratari, nici unul absența orice format.

În mod prestabilit, orice text este setat la nici unul și pentru linkuri subliniere, iar acest lucru trebuie luat în considerare la crearea unui site sau a unui șablon. Iată exemple de toate aceste comenzi pentru fișierul CSS.

Aliniați textul în CSS.

Este important să știți despre proiectarea alinierea textului în CSS care vă va permite să se alinieze textul de pe pagina în parametri, cum ar fi justificarea, la marginile din stânga și din dreapta. Pentru a face acest lucru, trebuie să vă înregistrați pentru parametrul tag-ul text-align și alege pentru ea este una dintre opțiunile din stânga (stânga justificate), centru (centrat) și dreapta (dreapta justificată).

De asemenea, puteți specifica o linie roșie pentru paragraf. După ce ați setat parametrul, veți avea un indent de o anumită dimensiune după fiecare paragraf. Pentru a face acest lucru, setăm parametrul text-indent și, folosind colonul, trebuie să specificați mărimea potrivită pentru indentare. Acum vom insera prima literă într-un paragraf de douăzeci de pixeli.

Dimensiunea fontului în css, stilul fontului în css și modul de decorare a textului cu css







Trimiteți-le prietenilor: