You’ve probably noticed bold text in websites you use, especially in news or text-heavy sites. It’s common to bold important headings or keywords. In CSS, we can style bold text with the font-weight
property.
If we want to bold
text in a web page, we can set the font-weight
to bold
.
p { font-weight: bold; }
If we want to ensure that text is not bold, we can set the font-weight
to normal
.
p { font-weight: normal; }
By default, the font-weight
of most text elements is set to normal
. Some elements, like headers, have built-in bold styling. A good approach is to check to see if the text element has any default styling, and use the font-weight
property accordingly.
Instructions
Taking a look at the web page in the browser, you’ll notice a “Banner” section, the blue section right below the navigation menu.
In style.css, in the banner section of the stylesheets, set the font weight of the paragraph within class banner
to bold
. You’ll notice that the letters in the paragraph in the web page thicken.