Text Boldness in CSS

In this lesson we will study the font-weight property, which allows you to make text bold or, conversely, remove boldness (for example, for headings, which are bold by default). To make text bold, you should specify the value bold, and to remove boldness, you should specify the value normal.

This property works similarly to the b tag, which we have already discussed. The difference is that it is much more convenient to control the boldness via CSS - you can, for example, make all paragraphs bold and all headings non-bold by making just a couple of entries in the CSS file.

If I were to make it bold using the b tag, I would have to wrap the contents of each paragraph in this tag, and this would be very time-consuming (and if I later want to remove the boldness from the paragraphs, I would have to remove all these tags, imagine how much extra, useless work this is).

In the following example, we will make all paragraphs bold and all headings h2 non-bold:

<h2>Title</h2>
<p>
	This is a paragraph with text.
</p>

h2 {
	font-weight: normal;
}
p {
	font-weight: bold;
}

Copy the following HTML code to your page:

<table border="1">
	<tr>
		<th>Name</th>
		<th>Surname</th>
		<th>Salary</th>
	</tr>
	<tr>
		<td>John</td>
		<td>Smith</td>
		<td>200$</td>
	</tr>
	<tr>
		<td>Nick</td>
		<td>Mayers</td>
		<td>300$</td>
	</tr>
	<tr>
		<td>Alex</td>
		<td>Jonson</td>
		<td>400$</td>
	</tr>
</table>

Set the table width to 500px and the height to 300px. Make the td cells bold and centered, and the th cells light.