Next »
147/920
« Previous

Compare font size in pixel, point, inch, mm and em, ex in HTML and CSS

Description

The following code shows how to compare font size in pixel, point, inch, mm and em, ex.

Example


<html>
<head>
<style type='text/css'>
p {font-family:arial; font-size:12pt;}
<!--from  w  w w  . j  ava  2s . c  o  m-->
p.px {font-size:12px;}
p.pt {font-size:12pt;}
p.pc {font-size:2pc;}
p.in {font-size:0.5in;}
p.cm {font-size:1cm;}
p.mm {font-size:12mm;}
p.em {font-size:1.5em;}
p.ex {font-size:1.5ex;}
</style>

</head>

<body>
<h1>Lengths</h1>
<p class="px">The length used here is 12 px</p>
<p class="pt">The length used here is 12 pt</p>
<p class="pc">The length used here is 2 pc</p>
<p class="in">The length used here is 0.5in</p>
<p class="cm">The length used here is 1cm</p>
<p class="mm">The length used here is 12mm</p>
<p class="em">The length used here is 1.5em</p>
<p class="ex">The length used here is 1.5ex</p>
</body>
</html>

Click to view the demo

The code above generates the following result.

Compare font size in pixel, point, inch, mm and em, ex in HTML and CSS
Next »
« Previous