logo

CSS-skriftstørrelse

Font-size-egenskapen i CSS brukes til å spesifisere høyden og størrelsen på skriften. Det påvirker størrelsen på teksten til et element. Standardverdien er middels og kan brukes på hvert element. Verdiene til denne eiendommen inkluderer xx-liten , liten , x-liten , etc.

Syntaks

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

Skriftstørrelsen kan være relativ eller absolutt.

Absolutt størrelse

Den brukes til å sette teksten til en bestemt størrelse. Ved å bruke absolutt størrelse er det ikke mulig å endre størrelsen på teksten i alle nettlesere. Det er fordelaktig når vi kjenner den fysiske størrelsen på utgangen.

Relativ størrelse

Den brukes til å angi størrelsen på teksten i forhold til naboelementene. Med relativ størrelse er det mulig å endre størrelsen på teksten i nettlesere.

java sortering av en arraylist

MERK: Hvis vi ikke definerer en skriftstørrelse, er standardstørrelsen 16px for normal tekst som avsnitt, som er lik 1em.

Skriftstørrelse med piksler

Når vi angir størrelsen på tekst med piksler, gir det oss full kontroll over størrelsen på 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> 
Test det nå

Skriftstørrelse med em

Den brukes til å endre størrelse på teksten. De fleste utviklerne foretrekker i i stedet for piksler . Det anbefales av World Wide Web Consortium (W3C). Som nevnt ovenfor er standard tekststørrelse i nettlesere 16px. Så vi kan si at standardstørrelsen på 1 em er 16 piksler .

java if-setning

Formelen for å beregne størrelsen fra piksler til i er em = piksler/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> 
Test det nå

Responsiv skriftstørrelse

Vi kan angi størrelsen på teksten ved å bruke en vw enhet , som står for ' visningsportens bredde '. Viewporten er størrelsen på nettleservinduet.

1vw = 1 % av visningsportens bredde.

Hvis bredden på visningsporten er 50 cm, er 1vw lik 0,5 cm.

Eksempel

Første ledd har bredden 5vw.

Andre ledd med bredden 10vw.

hvor mange null for en million
Test det nå

Skriftstørrelse med egenskapen lengde

Den brukes til å angi størrelsen på skriften i lengden. Lengden kan være i cm, px, pt osv. Negative verdier på lengde eiendom er ikke tillatt i skriftstørrelse.

Syntaks

 font-size: length; 

Eksempel

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