Vlastnosť font-size v CSS sa používa na určenie výšky a veľkosti písma. Ovplyvňuje veľkosť textu prvku. Jeho predvolená hodnota je stredná a dá sa použiť na každý prvok. Hodnoty tejto nehnuteľnosti zahŕňajú xx-malý , malý , x-malé , atď.

Syntax

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

Veľkosť písma môže byť relatívna alebo absolútna.

Absolútna veľkosť

Používa sa na nastavenie určitej veľkosti textu. Pomocou absolútnej veľkosti nie je možné zmeniť veľkosť textu vo všetkých prehliadačoch. Je výhodné, keď poznáme fyzickú veľkosť výstupu.

Relatívna veľkosť

Používa sa na nastavenie veľkosti textu vzhľadom na jeho susedné prvky. Pomocou relatívnej veľkosti je možné zmeniť veľkosť textu v prehliadačoch.

POZNÁMKA: Ak nedefinujeme veľkosť písma, potom pre normálny text, ako sú odseky, je predvolená veľkosť 16 pixelov, čo sa rovná 1 em.

Veľkosť písma s pixelmi

Keď nastavíme veľkosť textu pomocou pixelov, poskytne nám to plnú kontrolu nad veľkosťou textu.

Príklad

 #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> 

Veľkosť písma s em

Používa sa na zmenu veľkosti textu. Väčšina vývojárov dáva prednosť v namiesto pixelov . Odporúča ho celosvetové webové konzorcium (W3C). Ako je uvedené vyššie, predvolená veľkosť textu v prehliadačoch je 16 pixelov. Môžeme teda povedať, že predvolená veľkosť 1 m je 16 pixelov .

mamta kulkarni herec

Vzorec na výpočet veľkosti z pixelov do v je em = pixelov/16 .

Príklad

 #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> 

Responzívna veľkosť písma

Veľkosť textu môžeme nastaviť pomocou a jednotka vw , čo znamená „ šírka výrezu '. Zobrazená oblasť je veľkosť okna prehliadača.

jvm

1vw = 1% šírky výrezu.

Ak je šírka výrezu 50 cm, potom sa 1vw rovná 0,5 cm.

Príklad

Prvý odsek má šírku 5vw.

Druhý odsek má šírku 10vw.

Veľkosť písma s vlastnosťou length

Slúži na nastavenie veľkosti písma na dĺžku. Dĺžka môže byť v cm, px, pt atď. Záporné hodnoty dĺžka vlastnosti nie sú povolené vo veľkosti písma.

Syntax

 font-size: length; 

Príklad

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