logo

CSS fonta lielums

Fonta lieluma rekvizīts CSS tiek izmantots, lai norādītu fonta augstumu un lielumu. Tas ietekmē elementa teksta lielumu. Tā noklusējuma vērtība ir vidēja, un to var lietot katram elementam. Šī īpašuma vērtībās ietilpst xx-mazs , mazs , x-mazs utt.

Sintakse

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

Fonta lielums var būt relatīvs vai absolūts.

Absolūtais izmērs

To izmanto, lai tekstam iestatītu noteiktu izmēru. Izmantojot absolūto izmēru, nav iespējams mainīt teksta lielumu visās pārlūkprogrammās. Tas ir izdevīgi, ja mēs zinām izvades fizisko izmēru.

Relatīvais izmērs

To izmanto, lai iestatītu teksta lielumu attiecībā pret blakus esošajiem elementiem. Izmantojot relatīvo izmēru, ir iespējams mainīt teksta lielumu pārlūkprogrammās.

PIEZĪME. Ja mēs nenosakām fonta lielumu, parastajam tekstam, piemēram, rindkopām, noklusējuma izmērs ir 16 pikseļi, kas ir vienāds ar 1em.

Fonta lielums ar pikseļiem

Kad mēs iestatām teksta lielumu ar pikseļiem, tas nodrošina mums pilnīgu kontroli pār teksta lielumu.

Piemērs

 #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> 
Izmēģiniet to tūlīt

Fonta lielums ar em

To izmanto, lai mainītu teksta izmēru. Lielākā daļa izstrādātāju dod priekšroku iekšā tā vietā pikseļi . To iesaka globālā tīmekļa konsorcijs (W3C). Kā minēts iepriekš, noklusējuma teksta lielums pārlūkprogrammās ir 16 pikseļi. Tātad, mēs varam teikt, ka noklusējuma lielums 1em ir 16 pikseļi .

Formula izmēra aprēķināšanai no pikseļi uz iekšā ir em = pikseļi/16 .

Piemērs

 #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> 
Izmēģiniet to tūlīt

Atbildīgs fonta lielums

Mēs varam iestatīt teksta lielumu, izmantojot a vw vienība , kas apzīmē ' skata loga platums '. Skata logs ir pārlūkprogrammas loga izmērs.

1vw = 1% no skata loga platuma.

Ja skata loga platums ir 50 cm, tad 1vw ir vienāds ar 0,5 cm.

Piemērs

Pirmā rindkopa ar platumu 5vw.

citādi ja java

Otrā rindkopa ar platumu 10vw.

Izmēģiniet to tūlīt

Fonta lielums ar garuma rekvizītu

To izmanto, lai iestatītu fonta lielumu garumā. Garums var būt cm, px, pt utt. Negatīvās vērtības garums rekvizīti nav atļauti fonta izmērā.

Sintakse

 font-size: length; 

Piemērs

 .length { color:red; font-size: 5cm; } <p class="length">A paragraph having length 5cm.</p> 
Izmēģiniet to tūlīt