Set font-weight to lighter in HTML and CSS

Description

The following code shows how to set font-weight to lighter.

Example


<html>
<head>
<style type='text/css'>
body {<!-- w w  w.j a  va 2  s .  c o  m-->
font-family: monospace;
font-weight: bold;
}
div {
font-weight: lighter;
}
</style>
</head>
<body>
This font is bold.
<div>
This font is lighter than the font for the &lt;body&gt; element.
</div>
</body>
</html>

Click to view the demo

The code above generates the following result.

Set font-weight to lighter in HTML and CSS
Home »
  HTML CSS Tutorial »
    Text »
      Font Weight
HTML CSS Tutorial Font Weight
Compare font-weight by number from 100 to 9...
Compare font-weight properties in HTML and ...
Set font-weight bolder in HTML and CSS
Set font weight normal in HTML and CSS
Set font weight to bold for the first line ...
Set font weight to bolder in HTML and CSS
Set font-weight to lighter in HTML and CSS