font-weight: normal, bold, bolder, lighter : font weight « CSS « HTML / CSS






  1. HTML / CSS
  2. CSS
  3. font weight

font-weight: normal, bold, bolder, lighter

   
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title></title>
        <style type='text/css'>
            body {
                font-family: "Rockwell";
            }
        </style>
    </head>
    <body>
        <p style='font-weight: normal;'>
            This font is normal.
        </p>
        <p style='font-weight: bold;'>
            This font is bold.
        </p>
        <p style='font-weight: bolder;'>
            This font is bolder.
        </p>
        <p style='font-weight: lighter;'>
            This font is lighter.
        </p>
        <p style='font-weight: 100;'>
            This font is 100 weight.
        </p>
        <p style='font-weight: 200;'>
            This font is 200 weight.
        </p>
        <p style='font-weight: 300;'>
            This font is 300 weight.
        </p>
        <p style='font-weight: 400;'>
            This font is 400 weight.
        </p>
        <p style='font-weight: 500;'>
            This font is 500 weight.
        </p>
        <p style='font-weight: 600;'>
            This font is 600 weight.
        </p>
        <p style='font-weight: 700;'>
            This font is 700 weight.
        </p>
        <p style='font-weight: 800;'>
            This font is 800 weight.
        </p>
        <p style='font-weight: 900;'>
            This font is 900 weight.
        </p>
    </body>
</html>








Related examples in the same category

1.'font-weight' Example
2.font-weight: lighter
3.font-weight: bolder
4.font-weight by number from 100 to 900
5.font weight for p
6.font weight
7.font weight and bolder
8.font weight lighter
9.font-weight:normal; font-weight:bold; font-weight:lighter; font-weight:bolder;
10.font weight settings
11.font weight normal
12.Set font weight to bold for the first text in paragraph
13.Header text-transform: uppercase;
14.font-weight:900; assigns the constant 900 to font-weight.
15.font weight bolder
16.use the following constants for font-weight: normal, bold, bolder, lighter.
17.Font Weight by number
18.Font weight by value