Egenskaben font-size i CSS bruges til at angive skrifttypens højde og størrelse. Det påvirker størrelsen af ​​teksten i et element. Dens standardværdi er medium og kan anvendes på hvert element. Værdierne af denne ejendom omfatter xx-lille , lille , x-lille , etc.

Syntaks

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

Skriftstørrelsen kan være relativ eller absolut.

Absolut størrelse

Det bruges til at indstille teksten til en bestemt størrelse. Ved at bruge absolut størrelse er det ikke muligt at ændre størrelsen på teksten i alle browsere. Det er en fordel, når vi kender den fysiske størrelse af output.

Relativ størrelse

Den bruges til at indstille størrelsen af ​​teksten i forhold til dens naboelementer. Med relativ størrelse er det muligt at ændre størrelsen på teksten i browsere.

java sortering af en arraylist

BEMÆRK: Hvis vi ikke definerer en skriftstørrelse, så er standardstørrelsen 16px for normal tekst såsom afsnit, hvilket er lig med 1em.

Skriftstørrelse med pixels

Når vi indstiller størrelsen på tekst med pixels, giver det os fuld kontrol over størrelsen af ​​teksten.

Eksempel

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

Skriftstørrelse med em

Det bruges til at ændre størrelsen på teksten. De fleste af udviklerne foretrækker i i stedet for pixels . Det anbefales af World Wide Web Consortium (W3C). Som nævnt ovenfor er standardtekststørrelsen i browsere 16px. Så vi kan sige, at standardstørrelsen på 1 em er 16 px .

design mønstre i java

Formlen til beregning af størrelsen fra pixels til i er em = pixels/16 .

Eksempel

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

Responsiv skriftstørrelse

Vi kan indstille størrelsen på teksten ved at bruge en vw enhed , som står for ' visningsportens bredde '. Viewporten er størrelsen på browservinduet.

1vw = 1 % af visningsportens bredde.

Hvis bredden af ​​viewporten er 50 cm, så er 1vw lig med 0,5 cm.

Eksempel

Første afsnit har en bredde på 5vw.

Andet afsnit med en bredde på 10vw.

preg_match

Skriftstørrelse med egenskaben længde

Det bruges til at indstille størrelsen på skrifttypen i længden. Længden kan være i cm, px, pt osv. Negative værdier på længde egenskaber er ikke tilladt i skriftstørrelse.

Syntaks

 font-size: length; 

Eksempel

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