Как? Так! Ответы на популярные вопросы

Поделиться:

Как выделить текст жирным с помощью HTML

Содержимое:

2 метода:

Язык разметки HTML позволяет выделить текст жирным без особых проблем, причем даже сразу несколькими способами. Впрочем, будет лучше, если вы потратите пару минут, изучая базовые правила каскадных таблиц стилей — CSS, и добавите их в документ, чтобы уже потом работать именно там. Суть в том, что куда проще управлять внешним видом веб-страницы из CSS, в том числе и тогда, когда что-то нужно выделить жирным.

1 Создание жирного текста с помощью HTML

  1. 1 <strong>Используйте тег strong</strong>. В HTML5, согласно спецификации, выделять текст лучше именно так. Почти всегда этот тег выделит текст жирным.
    • Поместите текст, который нужно выделить, внутри тегов: <strong>именно тут</strong>.
  2. 2 Используйте заголовки, если это уместно. Как правило, их размещают в верхних частях страницы или в начале нового раздела. По умолчанию, заголовки отображаются крупнее и жирнее обычного текста, хотя и тут не без тонкостей. Есть шесть уровней заголовков, от 1 до 6:<h1> - <h6>. Follow these guidelines when using them:
    • Заголовок h1 пишется так: <h1>заголовок первого уровня</h1>, и это самый важный, крупнейший заголовок страницы.
    • <h2>Заголовок h2</h2> - для второго по значимости заголовка, ну и так далее вплоть до самого <h6>заголовка h6, самого мелкого из всех</h6>.
    • Использовать заголовки нужно аккуратно, в меру, единственно для упорядочивания контента страницы. Пользователь должен иметь возможность увидеть заголовок как можно быстрее, чтобы понять, под ним ли нужный ему контент.
    • Создавая подзаголовки, стоит опускаться всего на уровень за раз. Иными словами, не надо ставить после <h1> сразу <h3>. Так форматирование страницы при конвертации в иной формат не собьется.
  3. 3 <b>В крайнем случае, используйте тег b</b>. Тег <b> все еще поддерживается в HTML5, но <strong> куда как лучше. Использовать <b> можно в том случае, когда текст выделяется в стилистических, не семантических целях — например, для выделения ключевых или словарных слов, названий товаров и так далее.
    • Как и большинство тегов, <b> - парный, управляющий помещенным внутрь него текстом</b>.

2 Создание жирного текста с помощью CSS

  1. 1 Запомните, когда стоит использовать CSS. CSS — очень мощный и удобный инструмент редактирования внешнего вида страницы. Собственно, CSS — это то, как страница «выглядит», тогда как HTML – то, что она «значит». Конечно, в тегах HTML нет ничего плохого, ими можно пользоваться, но лучше все же работать с CSS — вы получите больше контроля над тем, как именно будет выглядеть ваш текст.
    • Откройте простую HTML-страницу в разных браузерах. Заметили, что она отображается слегка по-разному в каждом? С помощью CSS можно свести эту разницу к минимуму.
  2. 2 Добавьте к тексту тег <span>. Если вы еще не владеете CSS, то начать стоит с так называемого "inline CSS" - «встроенных таблиц стилей», если угодно. Этим, конечно, можно пользоваться, чтобы менять вид тегов вроде <p> или <h1>, но порой так можно поменять и такой текст, который еще не взят в какие бы то ни было теги. Тег <span></span> - это как бы обертка, которая сама по себе никакого эффекта или влияния не оказывает, но дает нам возможность привнести нужные изменения на страницу. Вот пример:
    • <span>Я учусь выделять текст жирным с помощью inline CSS.</span>
  3. 3 Добавьте атрибут style. Атрибуты в HTML пишутся прямо в теге, прямо в галочках < >. Атрибут style необходим для вставки CSS-кода в HTML-тег, так что вставьте style= в тег span:
    • <span style=>Я учусь выделять текст жирным с помощью inline CSS..</span>
    • Зачем добавлять атрибут style, если не добавлять сам стиль? Мыслите верно. Но мы здесь излагаем все пошагово!
  4. 4 Добавьте свойство font-weight. Свойства CSS добавляются как часть атрибута, в нашем случае — как часть атрибута style, а именно «font-weight» (жирность шрифта, если буквально). Это свойство может быть использовано для задания начертания шрифта, причем не только жирного, но и экстра-жирного, тонкого или нормального. После знака = напишите "font-weight: ". Должно получиться примерно так:
    • <span style="font-weight: ">Я учусь выделять текст жирным с помощью inline CSS..</span>
    • Пока сделайте паузу, ничего больше не пишите (и да, еще не все).
    • Не забудьте поставить кавычки до и после font-weight:.
  5. 5 Добавьте значение bold. Что осталось? Правильно, задать свойству атрибута значение! Куда его вставить? Правильно, между font-weight: и закрывающей кавычкой. У этого свойства есть несколько разновидностей, отличающихся жирностью начертания, и проще всего будет воспользоваться значением bold:
    • <span style="font-weight:bold">Я учусь выделять текст жирным с помощью inline CSS.</span>
  6. 6 Поэкспериментируйте с другими значениями. CSS дает куда больше возможностей, чем HTML, так что не думайте, будто вы связаны по рукам и ногам. Вот несколько альтернатив значению "bold":
    • <span style="font-weight:bolder">"Bolder" — так текст всегда будет жирнее родительского элемента, сколь бы жирным тот ни был сам по себе.</span> Если весь параграф выделен с помощью "bold," то "bolder" поможет выделить еще жирнее, скажем, отдельное предложение, находящееся в нем.
    • <span style="font-weight:normal">"Normal" — такой текст будет выглядеть как обычно, даже когда находится внутри тега, выделяющего текст жирным.</span>
    • <span style="font-weight:900">Для задания жирности текста можно использовать значения от 100 до 900. 400 — обычное начертание, жирное - от 700 и выше.</span>

Советы

  • Используя в CSS для задания жирности цифровые значения, используйте те, что кратны 100. Все иные значения все равно будут округляться в большую сторону.
  • Внешний CSS-файл, что и говорить, куда удобнее того, о чем рассказывается в этой статье — так можно будет из одного файла управлять внешним видом всех страниц сайта сразу!
  • Нельзя сделать шрифт жирнее, чем заложено в него изначально типографами. Работая с CSS, помните — шрифт будет меняться согласно стандарту. Соответственно, разницы между двумя жирными вариантами шрифтов вы не увидите (точнее, можете и увидеть — но это уже зависит от шрифта).
Прислал: Большакова Ольга . 2017-11-05 16:41:41
Поделиться: