Font Weight by number : font weight « CSS « HTML / CSS
- HTML / CSS
- CSS
- font weight
Font Weight by number
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>CSS Example</title>
<style rel="stylesheet" type="text/css">
td {
width: 200px;
}
p.one {
font-weight: normal;
}
p.two {
font-weight: bold;
}
p.three {
font-weight: bolder;
}
p.four {
font-weight: lighter;
}
p.five {
font-weight: 100;
}
p.six {
font-weight: 200;
}
p.seven {
font-weight: 300;
}
p.eight {
font-weight: 400;
}
p.nine {
font-weight: 500;
}
p.ten {
font-weight: 600;
}
p.eleven {
font-weight: 700;
}
p.twelve {
font-weight: 800;
}
p.thirteen {
font-weight: 900;
}
</style>
</head>
<body>
<h1>Font Weight</h1>
<table><tr><td valign="top">
<p class="one">normal</p>
<p class="two">bold</p>
<p class="three">bolder</p>
<p class="four">lighter</p>
</td><td>
<p class="five">100</p>
<p class="six">200</p>
<p class="seven">300</p>
<p class="eight">400</p>
<p class="nine">500</p>
<p class="ten">600</p>
<p class="eleven">700</p>
<p class="twelve">800</p>
<p class="thirteen">900</p>
</td></tr></table>
</body>
</html>
Related examples in the same category