Html CSS Tutorials


Html Font Size Tutorial CSS Style

The font-size property sets the size of the font.
To set the font size, numbers, strings, percentage and pixel font sizes may used. The following font size examples shows how to set the font size style with css.



Css style code font size

.fontsizesmall   {font-size:small;}
.fontsizesmaller {font-size:smaller;}
.fontsizexsmall  {font-size:x-small;}
.fontsizexxsmall {font-size:xx-small;}
.fontsizemedium {font-size:medium;}
.fontsizelarge {font-size:large;}
.fontsizelarger {font-size:larger;}
.fontsizexlarge {font-size:x-large;}
.fontsizexxlarge {font-size:xx-large;}

Html code font size

<span class="fontsizexxlarge">Font size xx-large</span><br />
<span class="fontsizexlarge">Font size x-large</span><br />
<span class="fontsizelarge">Font size large</span><br />
<span class="fontsizelarger">Font size larger</span><br />
<span class="fontsizemedium">Font size medium</span><br />
<span class="fontsizesmall">Font size small</span><br />
<span class="fontsizesmaller">Font size smaller</span><br />
<span class="fontsizexsmall">Font size x-small</span><br />
<span class="fontsizexxsmall">Font size xx-small</span><br />

HTML Output
Font size xx-large
Font size x-large
Font size large
Font size larger
Font size medium
Font size small
Font size smaller
Font size x-small
Font size xx-small


Css style code font size by percentage

.fontsize50   {font-size:50%;}
.fontsize75   {font-size:75%;}
.fontsize100   {font-size:100%;}
.fontsize150   {font-size:150%;}
.fontsize200   {font-size:200%;}

Html code font size by percentage

<span class="fontsize50">Font size 50%</span><br />
<span class="fontsize75">Font size 75%</span><br />
<span class="fontsize100">Font size 100%</span><br />
<span class="fontsize150">Font size 150%</span><br />
<span class="fontsize200">Font size 200%</span><br />

HTML Output
Font size 50%
Font size 75%
Font size 100%
Font size 150%
Font size 200%


Css style code font size by pixel

.fontsize8   {font-size:8px;}
.fontsize12   {font-size:12px;}
.fontsize18   {font-size:18px;}
.fontsize24   {font-size:24px;}

Html code font size by pixel

<span class="fontsize8">Font size 8px</span><br />
<span class="fontsize12">Font size 12px</span><br />
<span class="fontsize18">Font size 18px</span><br />
<span class="fontsize24">Font size 24px</span><br />

HTML Output
Font size 8px
Font size 12px
Font size 18px
Font size 24px

Html css font size examples.