The font-weight property of the CSS is used to set the weight or thickness of the font being used with the HTML Text. The font weight applied will depend on font-family used and the browser. For example, some font-family are available only in specific weights.
font-weight: normal | bold | lighter | bolder | number | initial | inherit | unset;
- normal: This defines the normal font weight (default font weight). It is equal to the number value 400.
- bold: This defines the bold font weight, it is equal to the number value 700.
Relative Keyword Values:
- lighter: This makes the font weight one level lighter than the parent element, considering the available font weights of the font family.
- bolder: This makes the font weight one level heavier than the parent element, considering the available font weights of the font family.
- number: This sets the font weight according to the number specified. The number can range between 1 to 1000. If the exact weight is unavailable, suitable weight is applied.
- initial: This sets the font weight to initial(default) value.
- inherit: This sets the font weight equal to the value inherited from its parent element.
- unset: This sets the font weight equal to the value inherited from its parent element, since font-weight is a inheritable property.
Supported Browsers: The browser supported by CSS | font-weight Property are listed below:
- Google Chrome 2.0
- Internet Explorer 4.0
- Firefox 1.0
- Safari 1.3
- Opera 3.5
Reference: Mozilla Developer Network (MDN)
Please comment below, if you found any errors, or have suggestions for improvements.
Attention reader! Don’t stop learning now. Get hold of all the important DSA concepts with the DSA Self Paced Course at a student-friendly price and become industry ready.