Font is used to change style of the text using different font properties
It changes the size of the text using property font size
<p>Fontsize</p>
<p style="font-size:30px">TechFunda</p>
In the above code snippet we have fontsize with 30px which changes the height of the text by 30px
output
It changes the style of font
<p>Fontstyle</p>
<p style="font-style:inherit">TechFunda</p>
<p style="font-style:initial">TechFunda</p>
<p style="font-style:italic">TechFunda</p>
<p style="font-style:normal">TechFunda</p>
<p style="font-style:oblique">TechFunda</p>
In the above code snippet we have defined font style with initia, inherit, italic, normal, oblique
output
It changes the style of the text
<p>Fontfamily</p>
<p style="font-family:'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif">TechFunda</p>
<p style="font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif">TechFunda</p>
<p style="font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif">TechFunda</p>
<p style="font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif">TechFunda</p>
<p style="font-family:'Times New Roman', Times, serif">TechFunda</p>
In the above code snippet we have defined the font family to define the style by giving different values in the style
output
It changes text to bold and normal letters
<p>Font-weight</p>
<p style="font-weight:bolder">TechFunda</p>
<p style="font-weight:bold">TechFunda</p>
<p style="font-weight:normal">TechFunda</p>
<p style="font-weight:initial">TechFunda</p>
In the above code snippet we have font weight as bold and normal letters
output
It changes the text to small caps and capital letters
<p>Font variant</p>
<p style="font-variant:normal">Techfunda</p>
<p style="font-variant:small-caps">TechFunda</p>
In the above code snippet we have defined font variant to change text to small and capital letters
output
Views: 3525 | Post Order: 137