Proprietatea font-size din CSS este utilizată pentru a specifica înălțimea și dimensiunea fontului. Afectează dimensiunea textului unui element. Valoarea sa implicită este medie și poate fi aplicată fiecărui element. Valorile acestei proprietăți includ xx-mic , mic , x-mic , etc.

Sintaxă

 font-size: medium|large|x-large|xx-large|xx-small|x-small|small|; 

Mărimea fontului poate fi relativă sau absolută.

Mărime absolută

Este folosit pentru a seta textul la o dimensiune definită. Folosind dimensiunea absolută, nu este posibilă modificarea dimensiunii textului în toate browserele. Este avantajos când cunoaștem dimensiunea fizică a ieșirii.

coada java

Mărime relativă

Este folosit pentru a seta dimensiunea textului în raport cu elementele învecinate. Cu relative-size, este posibilă modificarea dimensiunii textului în browsere.

NOTĂ: Dacă nu definim o dimensiune a fontului, atunci pentru textul normal, cum ar fi paragrafele, dimensiunea implicită este 16px, care este egală cu 1em.

Dimensiunea fontului cu pixeli

Când setăm dimensiunea textului cu pixeli, atunci ne oferă controlul deplin asupra dimensiunii textului.

Exemplu

 #first { font-size: 40px; } #second { font-size: 20px; } <p id="first">This is a paragraph having size 40px.</p> <p id="second">This is another paragraph having size 20px.</p> 

Dimensiunea fontului cu em

Este folosit pentru a redimensiona textul. Majoritatea dezvoltatorilor preferă în în loc de pixeli . Este recomandat de consorțiul World Wide Web (W3C). După cum sa menționat mai sus, dimensiunea implicită a textului în browsere este de 16 px. Deci, putem spune că dimensiunea implicită a 1em este 16px .

Formula de calcul a mărimii din pixeli la în este em = pixeli/16 .

Exemplu

 #first { font-size: 2.5em; /* 40px/16=2.5em */ } #second { font-size: 1.875em; /* 30px/16=1.875em */ } #third { font-size: 0.875em; /* 14px/16=0.875em */ } <p id="first">First paragraph.</p> <p id="second">Second paragraph</p> <p id="third">Third Paragraph.</p> 

Dimensiunea fontului receptiv

Putem seta dimensiunea textului folosind a unitate vw , care înseamnă „ lățimea ferestrei de vizualizare '. Vizualizarea are dimensiunea ferestrei browserului.

jvm

1vw = 1% din lățimea ferestrei de vizualizare.

Dacă lățimea feței de vizualizare este de 50 cm, atunci 1vw este egal cu 0,5 cm.

Exemplu

Primul paragraf având lățimea de 5vw.

Al doilea paragraf având lățimea de 10vw.

Dimensiunea fontului cu proprietatea lungime

Este folosit pentru a seta dimensiunea fontului în lungime. Lungimea poate fi în cm, px, pt etc. Valori negative ale lungime proprietățile nu sunt permise în dimensiunea fontului.

Sintaxă

 font-size: length; 

Exemplu

 .length { color:red; font-size: 5cm; } <p class="length">A paragraph having length 5cm.</p>