CSS - font-weight


Advertisements


Description

The font-weight property alters the visual weight of characters in an element.

Possible Values

  • 100, 200, 300, 400, 500, 600, 700, 800 and 900 − Defines from thin to thick characters. 400 is the same as normal, and 700 is the same as bold.

  • normal − Default. Defines normal characters and equivalent to the value 400.

  • bold − Equivalent to the value 700.

  • bolder − The font characters for the element should be heavier than those of the parent element.

  • lighter − The font characters for the element should be lighter than those of the parent element.

Applies to

All the HTML elements.

DOM Syntax

object.style.fontWeight = "900";

Example

Here is the example using this property −

<html>
   <head>
   </head>
   <body>
      <p style="font-weight:bold;">
      This font is bold.
      </p>
      
      <p style="font-weight:bolder;">
      This font is bolder.
      </p>
      
      <p style="font-weight:900;">
      This font is 900 weight.
      </p>
   </body>
</html> 

This will produce following result −



Advertisements