13.Жирность текста на CSS
В данном уроке мы с вами изучим свойство font-weight, которое позволяет сделать текст жирным или наоборот - отменить жирность (к примеру, для заголовков, которые жирные по умолчанию). Чтобы сделать текст жирным, следует указать значение bold, а чтобы отменить жирность - значение normal.
Это свойство работает аналогично тегу b, который мы с вами уже разобрали. Разница в том, что через CSS управлять жирностью гораздо удобнее - я могу заставить все абзацы стать жирными, а все заголовки - нежирными, сделав всего пару записей в CSS файле.
Если бы я делал жирный через тег b - мне пришлось бы содержимое каждого абзаца обернуть в этот тег, а это было бы очень затратным по времени (а если я потом захочу убрать жирность абзацам - мне придется убирать все эти теги, представьте, сколько это лишней, бесполезной работы).
В следующем примере мы сделаем все абзацы жирными, а все заголовки h2 - нежирными:
<h2>Заголовок</h2>
<p>
абзац с текстом
</p>h2 {
font-weight: normal;
}
p {
font-weight: bold;
}
Результат выполнения кода:
Заголовок абзац с текстом
Задача 1
Скопируйте следующий HTML код себе на страницу:
<table border="1">
<tr>
<th>Имя</th>
<th>Фамилия</th>
<th>Зарплата</th>
</tr>
<tr>
<td>Иван</td>
<td>Иванов</td>
<td>200$</td>
</tr>
<tr>
<td>Николай</td>
<td>Петров</td>
<td>300$</td>
</tr>
</table>
Результат выполнения кода:
Имя | Фамилия | Зарплата |
---|---|---|
Иван | Иванов | 200$ |
Николай | Петров | 300$ |
Установите таблице ширину в 500px
высоту в 300px
Сделайте ячейки td жирными и по центру
ячейки th - нежирными