Как сделать текст жирным?
Чтобы выделить отдельные слова в предложении жирным начертанием в HTML применяется два элемента:
Обратите внимание, что в первую очередь сообщает о важности выделенного текста и по совместительству делает текст жирным. Поэтому для обычного по важности, но жирного по виду текста, следует использовать (пример 1).
Пример 1. Использование
Чтобы придать жирное начертание длинному тексту, вроде заголовков, удобнее использовать стили, в частности, свойство font-weight. В качестве значения достаточно указать bold (пример 2).
Пример 2. Использование font-weight
См. также
- font-weight
- Знакомство с HTML
- Насыщенность
- Продвинутая семантика и доступность
- Свойства шрифта в CSS
- Семантика строчных элементов
Сделать жирным одно слово в предложении через CSS
Чтобы выделить одно слово из предложения жирным шрифтом средствами HTML нужно использовать тэг Word или Word . Но, все говорят, что нужно оформление полностью делать в CSS. За жирность в CSS отвечает font-weight: . Я пробовал заключать слово в , но он переносит текст за измененным словом на новую строку. Как можно решить проблему?
Отслеживать
задан 6 фев 2016 в 12:53
7 1 1 серебряный знак 4 4 бронзовых знака
не слушайте этих ВСЕХ, это глупость. используйте strong , он для того и придуман.
6 фев 2016 в 13:53
Если вам дан исчерпывающий ответ, отметьте его как верный (галка напротив выбранного ответа).
7 фев 2016 в 6:06
2 ответа 2
Сортировка: Сброс на вариант по умолчанию
Поместить его в тег span :
span.bold
Привет, мир!Отслеживать
ответ дан 6 фев 2016 в 12:56
5,542 3 3 золотых знака 21 21 серебряный знак 41 41 бронзовый знак
Иногда семантика неотделима от оформления — в таком случае просто используйте или .
Если же оформление как-то связано с семантикой, то жирность можно «навесить» на любой семантический тэг. К примеру, на если вам надо выделять жирным аббревиатуры. Или на если вам нужно выделить сочетание клавиш.
Универсальным инлайновым тэгом является . Но использовать его желательно только вместе с уточнением в виде класса:
foo span.selected-word
Ну и по поводу . Этот тэг использовать также можно, если задать ему стиль display: inline . Но я бы не рекомендовал так делать, поскольку семантика тут точно нарушится (div — это раздел в тексте, а никак не слово).
Жирность текста в CSS
В данном уроке мы изучим свойство font-weight , которое позволяет сделать текст жирным или наоборот — отменить жирность (к примеру, для заголовков, которые жирные по умолчанию). Чтобы сделать текст жирным, следует указать значение bold , а чтобы отменить жирность — значение normal .
Это свойство работает аналогично тегу b , который мы уже разобрали. Разница в том, что через CSS управлять жирностью гораздо удобнее — можно, например, заставить все абзацы стать жирными, а все заголовки — нежирными, сделав всего пару записей в CSS файле.
Если бы я делал жирный через тег b — мне пришлось бы содержимое каждого абзаца обернуть в этот тег, а это было бы очень затратным по времени (а если я потом захочу убрать жирность абзацам — мне придется убирать все эти теги, представьте, сколько это лишней, бесполезной работы).
В следующем примере мы сделаем все абзацы жирными, а все заголовки h2 — нежирными:
Title
This is a paragraph with text.
h2 < font-weight: normal; >p < font-weight: bold; >
Скопируйте следующий HTML код себе на страницу:
| Name | Surname | Salary |
|---|---|---|
| John | Smith | 200$ |
| Nick | Mayers | 300$ |
| Alex | Jonson | 400$ |
Установите таблице ширину в 500px , а высоту в 300px . Сделайте ячейки td жирными и по центру, а ячейки th — нежирными.
Жирный текст CSS
В HTML жирный текст можно сделать несколькими способами. К ним относятся:
Поговорим о каждом из вариантов выделения текста по порядку.
Жирный текст: тег
Тег b HTML применяется следующим образом:
Конструктор сайтов "Нубекс"Для тега обязательно наличие закрывающего , и ему доступны универсальные атрибуты (такие как class, id, title и т.д.)
Хотя валидность тега b и не осуждается спецификацией HTML, более актуальным в использовании является тег strong, давайте разберемся почему.
Жирный текст: тег
Согласно спецификации HTML, тег b служит для выделения текста жирным шрифтом. В отличие от него, тег strong HTML служит для выделения важных фраз, слов, которые являются ключевыми для данной страницы.
Этот тег имеет весомое значение при ранжировании страниц в поисковой выдаче, поэтому он широко используется в продвижении сайтов и при SEO-оптимизации. Поисковые системы учитывают текст, заключенный в теги , и помечают его именно как важный.
Используется тег strong аналогичным образом:
Конструктор сайтов "Нубекс"Вы можете заметить, что внешне применение тегов и совсем не отличается (поскольку все современные браузеры интерпретируют их практически одинаково), но семантические различия в коде для поисковых систем, всё-таки, имеют место быть. Поэтому большинство SEO-оптимизаторов рекомендуют использовать тег strong.
Жирный текст при помощи CSS
Мы уже отмечали важность тега strong при поисковом продвижении, но что делать в случае, если нужно выделить большое количество текста жирным (но текст не нужно помечать для поисковиков как важный), или необходимо управлять степенью «жирности» шрифта? В таких случаях используется CSS-свойство font-weight. Применяется оно следующим образом:
Жирный текст с помощью CSS - "Нубекс" .nubex1 < font-weight: bold; >.nubex2 < font-weight: bolder; >.nubex3 Наши сайты - это, действительно, огромный шаг в веб-разработке.
Мы делаем по-настоящему качественные сайты.
Доверьтесь нам, и мы вас не подведем.
Значениями bolder и lighter можно задать степень жирности больше (или меньше), чем у родителя. Числовым значением (100-900) можно задать степень жирности.