Bold / bold text with CSS
Related Videos: Bold and Italic Text - HTML and CSS: Tutorial 5 (May 2024).
With CSS it is very easy to highlight texts by setting them "bold". In contrast to the HTML version, CSS gives you even more precise setting options.
Map font weight using the CSS property
You can use the "font-weight" property to control the strength of your font at will. You can assign the following values:
- normal
- bold
- bolder
- light
- lighter
- 100
- 200
- 300
- 400
- 500
- 600
- 700
- 800
- 900
- inherit
In theory, you should achieve precise subdivisions in font size, but in practice it looks different.
- "400" corresponds to the specification "normal", "700" is synonymous with "bold" and "900" achieves the same output as "bolder".
- However, you will notice that the output between the individual numerical values remains partially unchanged. This is because there are hardly any gradations in the font. So there is probably no difference between the values between "100" and "600", nor between "700" and "900".
- You will only need the values "400" or "normal" and "700" or "bold".
Bold texts with HTML tag
You can also bold font with an HTML tag, use the opening tag and the closing tag. The name is derived from the word "bold". This option corresponds to the CSS variant with the value "bold" or "700".