Как составить ТЗ: что такое техническое задание, основные требования и ошибки
Техническое задание (ТЗ) для разработчиков — это документ, в котором подробно изложены требования к программному продукту, сайту...
Как изменять начертание шрифта в CSS
В этой статье мы рассмотрим, как изменить начертание шрифта в css: жирный, наклонный, подчеркнутый. Начертание и внешний вид шрифта в css задается внутри атрибута style следующими свойствами, описанными ниже.
Font-style (начертание шрифта)
Свойство font-style определяет начертание шрифта в css — обычный или наклонный(курсив) и может иметь следующие значения:
- normal — обычный;
- italic — курсив, наклонный.
Для того чтобы изменить начертание шрифта в css на наклонный(курсив) нужно у атрибута style указать свойство font-style: italic. Пример, как сделать шрифт наклонным: <span style=»font-style:italic»>Данный текст с наклоном</span>.
Результат в браузере
Пример кода с наклонным шрифтом html
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Тестовая страница</title>
</head>
<body>
<span style="font-style:normal">Пример фразы normal</span> <br>
<span style="font-style:italic">Пример фразы italic</span> <br>
</body>
</html>Font-weight (жирность шрифта)
Свойство font-weight задает жирность шрифта и может иметь следующие значения:
- normal — нормальный(нежирный);
- bold — жирный.
2 способ как сделать шрифт жирным в html без css
В html есть специальные теги <b> и </b> которые делают находящийся внутри текст жирным. Результат применения тега <b> аналогичен свойству font-weight:bold.
Редко встречаемые значения свойства font-weight (есть не у всех шрифтов)
- lighter, 100, 200, 300, 400, 500. В случае отсутствия используется normal;
- bolder, 600, 700, 800, 900. В случае отсутствия используется bold.
Пример, как сделать шрифт жирным: <span style=»font-weight:bold»>жирное слово 1</span> и <b>жирное слово 2</b>.
Результат в браузере
Полный пример кода html, как изменить жирность шрифта
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Тестовая страница</title>
</head>
<body>
<span style="font-weight:normal">Пример фразы, значение normal</span> <br>
<span style="font-weight:bold">Пример фразы, значение bold</span> <br>
<b>Пример фразы, тег b</b> <br>
</body>
</html>Text-decoration (оформление текста, украшение)
Свойство text-decoration имеет следующие основные значения:
- line-through — перечеркивание текста;
- underline — подчеркивание текста;
- none — отмена всех эффектов, в том числе и заданное по умолчанию подчеркивание у ссылок.
Пример, как сделать шрифт подчеркнутым: Предложение с <span style=»text-decoration:underline»>подчеркнутым текстом</span>.
Результат в браузере
Полный пример кода html (Подчеркнутый и перечеркнутый шрифты)
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<title>Тестовая страница</title>
</head>
<body>
<span style="text-decoration:underline">Подчеркнутый текст</span> <br>
<span style="text-decoration:line-through">Перечеркнутый текст</span> <br>
<span style="text-decoration:none">Обычный текст</span> <br>
</body>
</html>Нужна доработка сайта?
Команда Hardkod профессионально доработает ваш сайт: добавим новый функционал, улучшим существующие процессы, подключим платежные системы и CRM. Мы технически поддержим ваше развитие, превращая пожелания в рабочие инструменты для увеличения продаж. Вы фокусируетесь на стратегии — мы на её техническом воплощении. Звоните 8 (800) 350-81-86 или оставляйте заявку на сайте.
Кейсы 
Продвижение магазина для beauty-мастеров в области наращивания ресниц и личного продуктового бренда клиента
Развлекательные центры Космик
Интернет-магазин подарков PichShop
Остались вопросы? Оставьте заявку
Закажите услугу прямо сейчас и получите консультацию специалиста бесплатно
Оставить заявкуЧитайте также
Меняем подрядчика по SEO: какие риски ждут?
SEO работает постепенно. В первые три месяца вы только начнете замечать первые результаты, а вот уже о достойном эффекте можно будет...
Привлекаем SEO-специалиста: при разработке сайта или после?
Нередко SEO-специалиста привлекают к работе уже на этапе продвижения сайта. До этого же заказчику достаточно и дизайнера с разработчиком..
Написать в Telegram
Написать в WhatsApp
Звонок 8 800 350 81 86