Тег жирный: Теги strong и b, важность и выделение — Разметка текста — HTML Academy — Вебджем.рф

Содержание

Как использовать основные теги HTML для SEO — STRONG, B, EM, I

22442

How-to

– Читать 6 минут

Прочитать позже

ЧЕК-ЛИСТ: КОНТЕНТНАЯ ЧАСТЬ → ИСПРАВЛЕНИЕ

Теги , , , следует использовать для визуального форматирования текста на странице сайта. Они необходимы для расстановки смысловых и зрительных акцентов. Неправильное использование тегов часто вводит читателя или поисковую систему в заблуждение. Почему? Разберемся в этой статье.

HTML — это язык разметки гипертекста. С его помощью мы сообщаем браузеру, какие элементы веб-страницы ему предстоит отобразить. Если ранее он отображал только визуальные элементы и текст, то сегодня язык HTML способен передавать и смысловую нагрузку наполнения страницы. Для этого разработчики используют специальные элементы для форматирования текста.

Текст форматируется по трем причинам:

Чтобы акцентировать внимание читателя на определенном слове или фразе.

Чтобы акцентировать внимание поисковых роботов и помогать им понять смысл того, что размещено на странице.

Чтобы создавать семантически правильный код, согласно требованиям W3C (World Wide Web Consortium).

Значение и отличия тегов

До недавнего времени язык HTML предлагал использовать теги и для написания текста жирным или курсивом. С появлением новой версии языка разметки HTML5, появились дополнительные теги, которые образовали близкие по своему предназначению пары:  и ,  и .

Их появление обусловлено развитием поисковых систем, которые сегодня стремятся понимать смысл того, что размещено на странице. Создатели предложили различать HTML-теги для текста, имеющие семантическое и визуальное форматирование. Теперь с помощью тегов визуального форматирования (, ) мы выделяем часть текста визуально, а теги семантического форматирования (, ) передают эмоции.

Визуально вы никогда не сможете различить, какой тег использован на странице. Жирный шрифт в HTML можно сделать и с помощью , и с помощью , а курсив — и через , и через . Тогда зачем же так усложнять?

Разгадка есть. Если включить голосовое озвучивание текста, то слова и фразы, выделенные тегами и , компьютер прочтет с особо эмоциональной интонацией и громкостью. Вся суть заключается в этом, так как семантическое форматирование помогает поисковым системам понять контекст написанного (смысл).

 — тег семантического форматирования. Он передает высокую важность выделенного текста. Визуально выглядит жирнее, чем основной текст.
 — тег визуального форматирования. Просто выделяет текст жирным и не придает ему особой важности.
<EM> — тег семантического форматирования. Предназначен для передачи большей экспрессивности слова или фразы относительно остального текста. Визуально слово/фраза отображаются курсивом.
 — тег визуального форматирования. Используется для выделения курсивом, но не акцентирует внимание на слове или фразе.

В спецификации W3C все теги HTML размещены в двух разделах. и находятся в разделе «Структурированный текст». Это значит, что они определяют внешний вид, а также учитываются специальными программами, которые предназначены для изменения интонации и громкости.

Внешний вид необязательно будет жирным или курсивом. Он может регулироваться стилями CSS, но по-прежнему передавать браузеру значение большей важности выделенного тегами текста, относительно другого. и вынесены в раздел «Форматирование» и указывают браузеру, как отобразить фрагмент текста.

Какой тег лучше использовать с точки зрения SEO?

Со стороны поисковых систем нет существенных указаний, как использовать основные теги HTML для оптимизации страниц. Сотрудники Google отрицают какую-либо разницу и разрешают использовать любые из них. Тем не менее трансформация алгоритмов дает повод усомниться.

Миссия поисковых систем — предоставить релевантный результат в ответ на запрос пользователя. Для этого они пытаются понять смысл того, что вы публикуете на своих страницах. Использование семантических тегов упрощает эту задачу. Они обращают внимание поисковых роботов на слова и фразы, которые помогают им определить, к какому запросу, вероятнее всего, принадлежит страница.

Однако существуют рекомендации W3C:

В HTML5 тег  используйте для особо важных фрагментов. Это наиболее актуально:

в заголовке или в названии раздела;
в части текста, который имеет особое значение, относительно другого текста;
чтобы выделить важную информацию, уведомить читателя о чем-то;
чтобы обратить внимание читателя прежде, чем он прочтет остальную информацию на странице.

Тег используйте для выделения:

ключевых слов;
имен и названий;
призыва к действию.

Используйте тег , когда вам надо обратить внимание на определенную часть текста. Особенно если это может указать на смысл. Продемонстрируем на простом примере:

Задано предложение: «Кошки — милые животные». В зависимости от того, где поставлен тег  изменится смысл.

«Кошки — милые животные» — если кто-то утверждает, что милы другие животные.

«Кошки — милые животные» — Если кто-то утверждает, что кошки — противные животные.

«Кошки — милые животные» — Если кто-то утверждает, что кошки — милые овощи.

Если делать смысловой акцент не надо, используйте тег . Он уместен для выделения цитаты, фразы, обозначения и т. п.

Заключение

Если вы хотите выделить ключевые слова, несущие смысл — используйте тег  или <EM>. Не используйте эти теги HTML для типовых фраз, например, «10% скидка», «распродажа складских остатков». Выделяйте их с помощью тегов и .

Избегайте вложений одинаковых тегов: фраза или слово. Поисковые системы воспринимают такие конструкции как спам и переоптимизацию. Ориентируйтесь на официальные рекомендации W3С.

Стоит ли менять старые теги на сайте, согласно новым рекомендациям? Скорее всего, нет. Это заберет у вас слишком много времени, и даст минимум результата в долгосрочной перспективе.

» title = «Как и в каких случаях использовать HTML-теги STRONG, B, EM, I 16261788165787» />

«Список задач» — готовый to-do лист, который поможет вести учет
о выполнении работ по конкретному проекту. Инструмент содержит готовые шаблоны с обширным списком параметров по развитию проекта, к которым также можно добавлять собственные пункты.

Начать работу со «Списком задач»

Сэкономьте время на изучении Serpstat

Хотите получить персональную демонстрацию сервиса, тестовый период или эффективные кейсы использования Serpstat?

Оставьте заявку и мы свяжемся с вами 😉

Оцените статью по 5-бальной шкале

4.58 из 5 на основе 11 оценок

Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.

Кейсы, лайфхаки, исследования и полезные статьи

Не успеваешь следить за новостями? Не беда! Наш любимый редактор подберет материалы, которые точно помогут в работе. Только полезные статьи, реальные кейсы и новости Serpstat раз в неделю. Присоединяйся к уютному комьюнити 🙂

Нажимая кнопку, ты соглашаешься с нашей политикой конфиденциальности.

Поделитесь статьей с вашими друзьями

Вы уверены?

Спасибо, мы сохранили ваши новые настройки рассылок.

Сообщить об ошибке

Отменить

Теги форматирования текста—ArcGIS Pro | Документация

Теги форматирования текста ArcGIS Pro позволяют изменять форматирование участков текста. Это позволяет создавать надписи смешанного формата, например, с одним подчеркнутым словом. Теги форматирования можно использовать практически везде, где нужно поместить текст. Их можно использовать везде, где есть возможность указать одновременно и сам текст, и символ текста. Например, теги можно использовать для выражений динамических надписей, аннотаций, текстов в легенде, заголовках карт, в динамическом тексте, а также в значениях полей, используемых для создания подписей объектов. Теги не обрабатываются на панели Содержание, в представлении таблицы или во всплывающих окнах, поэтому теги, добавленные в значения полей, будут видны как теги в этих областях.

См. таблицу доступных тегов форматирования текста

Динамический текст – это еще одна разновидность тега форматирования, которая динамически изменяет графический текст на основании текущего значения или зависящего от него свойства.

Более подробно о работе с динамическим текстом.

Синтаксис тегов форматирования

У тегов форматирования может быть разный синтаксис в зависимости от того, где они используются. В следующих примерах показан синтаксис для аннотаций и надписей. Синтаксис аннотаций применяется к тексту в компоновке страницы, к значениям полей, используемых для надписывания объектов, а также для аннотаций. Синтаксис надписей применяется к динамическим надписям. Во всех примерах синтаксиса надписей форматированный текст можно заменить на поле надписи.

В аннотации теги объединяются в текстовую строку без специальных символов:Аннотация

<BOL>Text</BOL>

В выражениях надписей теги форматирования необходимо заключать в двойные кавычки и соединять с другими частями выражения с помощью оператора конкатенации.

"<BOL>" + "Text" + "</BOL>"

"<BOL>" + $feature.LABELFIELD + "</BOL>"

"<BOL>" & "Text" & "</BOL>"

"<BOL>" & [LABELFIELD] & "</BOL>"

Для заполнения значений тегов форматирования можно использовать значения поля:Выражение надписи – Arcade

"<FNT size= '" + $feature.Size + "'>" + "Text" + "</FNT>"

"<FNT size= '" + $feature.Size + "'>" + $feature.LABELFIELD + "</FNT>"

"<FNT size= '" & [Size] & "'>" & "Text" & "</FNT>"

"<FNT size= '" & [Size] & "'>" & [LABELFIELD] & "</FNT>"

Более подробно о построении выражений надписей

В ArcGIS Pro для тегов форматирования применяются следующие правила синтаксиса:

Теги форматирования текста ArcGIS Pro используют правила синтаксиса XML. После каждого открывающего тега должен быть тег закрывающий. Теги могут быть вложенными, но внутренний тег должен быть закрыт прежде внешнего.
Аннотация
```
<BOL><UND>Text</UND></BOL>
```
Выражение надписи
```
"<BOL><UND>" + $feature.LABELFIELD + "</UND></BOL>"
```
Теги форматирования используют точку в качестве десятичного разделителя. Они не используют определяемый локалью символ.
Аннотация
```
<FNT size = "12.5">Textgröße = 12,5</FNT>
```
Выражение надписи
```
"<FNT size = '12.5'>" + "Textgröße = 12,5" + "</FNT>"
```

Атрибуты тегов должны быть заключены либо в одинарные, либо в двойные кавычки. Следующие выражения эквивалентны:

Аннотация

<FNT name='Arial' size='18'>My text</FNT>

<FNT name="Arial" size="18">My text</FNT>

Выражение надписи

'<FNT name="Arial" size="18">' + $feature. LABELFIELD + '</FNT>'

"<FNT name='Arial' size='18'>" + $feature.LABELFIELD + "</FNT>"

Парные теги должны в точности совпадать. Поэтому <BOL>…</BOL> — корректный синтаксис, как и <bol>…</bol>, а <Bol>…</bol> — некорректный.

Нераспознаваемые, разбалансированные пары тегов обработчиком игнорируются. Например, даже если не является допустимым тегом форматирования ArcGIS Pro, следующие строки допустимы, и будут отображаться правильно:
Аннотация
```
<notag><BOL>State College<BOL></notag>
```
Выражение надписи
```
"<notag><BOL>" + "State College" + "<BOL></notag>"
```

Символы & и < являются спецсимволами, поэтому их нельзя использовать вместе с тегами форматирования текста. Вместо них, используйте эквивалентные коды символов & и <.

Аннотация

Вместо <ITA>Джон & Пол</ITA> используйте:

<ITA>John &amp; Paul</ITA>

Выражение надписи

Это выражение заключает значения поля надписи в символы < >:

"<ITA>&lt;" + $feature.
  LABELFIELD + "></ITA>"

Если вам надо заключить значения поля надписей в спецсимволы, их можно динамически заместить с помощью простого скрипта для надписей.
Выражение надписи – Arcade
```
"<BOL>" + replace($feature.Notes, "&", "&amp;") + "</BOL>"
```
Выражение надписи – VBScript
```
Function FindLabel ([LABELFIELD])
 NewString = Replace([LABELFIELD],"&","&amp;") 
 FindLabel = "<ITA>" & NewString & "</ITA>"
End Function
```
Любой текстовый фрагмент на карте обладает символом, который используется для прорисовки. Теги форматирования временно отменяют указанный для текста базовый символ и отображают указанную часть текста с тем символом, который прописан в теге. Кнопки и команды на ленте Надписи и на панели Класс надписей закладки Символы всегда отражают параметры базовых символов выбранного текста, но не отражают изменения, выполненные с помощью тегов форматирования.

Например, если с помощью тега <FNT> изменить шрифт фрагмента текста, то когда эта надпись появится на карте в ниспадающем меню Шрифт на вкладке Надписи эти изменения отражены не будут; на ней будет отображен шрифт основного символа текста.
Теги не влияют на текстовые фрагменты, если они просто повторяют уже имеющиеся свойства базового символа текста. В целом, их поведение интуитивно понятно; например, если у вас есть тег <BOL>, а сам текст уже выделен полужирным, тег <BOL> в тексте ни на что не влияет. Также, в связи с тем, что теги следуют правилам XML, нельзя использовать тег </BOL> для отключения полужирного начертания базового текстового символа. Вместо этого используйте в этих целях тег <_BOL>.
Аннотация
```
This is bold if the base text symbol is bold <_BOL>, but this is not: </_BOL>
```
Выражение надписи
```
"This is bold if the base text symbol is bold <_BOL>, but this is not: </_BOL>"
```

Использование тегов форматирования текста Maplex Label Engine с параметрами форматирования

Теги форматирования текста разработаны для того, чтобы превалировать над свойствами, назначенными текстовым символам класса надписей. Maplex Label Engine распознает теги форматирования текста в процессе размещения надписей. Так как теги определяют то, как будет выглядеть надпись, и замещают параметры форматирования, Maplex Label Engine отключает параметры форматирования для класса надписей в случаях, когда он находит в строках надписей теги форматирования текста.

Далее приведен список ситуаций, в которых теги форматирования текста будут либо игнорироваться, либо изменять поведение Maplex Label Engine:

Maplex Label Engine игнорирует тег интервала между знаками. Чтобы учитывалось расстояние между символами (буквами), его необходимо задать в текстовом символе.
Maplex Label Engine игнорирует тег интервала между словами. Чтобы учитывалось расстояние между словами, его необходимо задать в текстовом символе.
Maplex Label Engine выключает поведение сокращения надписи, если надпись содержит тег форматирования размера шрифта или расстояния между строками.
Надписи, содержащие теги форматирования, не будут сокращаться Maplex Label Engine при использовании словаря сокращений.

Если некоторые надписи в классе надписей содержат теги форматирования текста, но ни одна из них не представлена в текущем экстенте карты, ни один тег форматирования не будет выявлен, и выше перечисленные ограничения не вступят в силу.

Дополнительные теги форматирования текста, которые поддерживает Maplex Label Engine

В Maplex Label Engine предусмотрен дополнительный уникальный тег: Base (основной).

"<BSE>" + $feature.FIELDNAME + "</BSE>"

Если при надписывании пространственного объекта используются несколько полей, необходимо указать, какая из надписей является ключевой или основной. Основная надпись применяется в стратегии расположения, и другие надписи размещаются относительно этой надписи.

Только Maplex Label Engine поддерживает тег Основной. Если Standard Label Engine обнаружит тег <BSE>, тег <BSE> будет проигнорирован и удален перед размещением надписи.

Например, для для классов надписей на следующем изображении задано расположение Справа от точки, так что надписи размещаются точно к востоку от точечного объекта. Связывая тег Base с первой строкой выражения надписи, вы управляете тем, как будет расположено относительно объекта все выражение надписи. В надписи слева не используется тег Base, а справа тег Base установлен вокруг первой строки надписи.

"<BSE>" + $feature.Name + "</BSE>" + TextFormatting.NewLine + $feature.Prov

Дополнительные подсказки по построению выражений надписей

Для построения выражений надписей вам помогут следующие советы:

Чтобы проверить корректность выражения надписи с тегами форматирования текста, нажмите Применить, чтобы применить изменения и рассмотреть надписи на карте. Если синтаксис тегов форматирования текста неверен, эти теги будут отображаться в надписях на карте как обычный текст.
В Arcade, Python, VBScript и JScript теги не интерпретируются. Вместо этого они передаются в среду ArcGIS Pro как обычный текст, и там уже динамически форматируются в процессе отображения. Теги в выражениях в кавычках не требуется специально брать в кавычки.
```
"Current <BOL>status</BOL> of parcel: " + $feature.LABELFIELD
```
Теги форматирования можно заключить в значения поля, которое вы используете для надписывания пространственных объектов слоя независимо от того, используете ли вы выражение надписи. Таким образом, можно изменить формат любой части определенного значения в поле надписи. Чтобы применять теги форматирования, поле надписей должно быть текстового типа. Теги и атрибуты тегов, используемые в значениях полей, не требуется заключать в знаки кавычек или использовать операторы конкатенации, поэтому приведенные ниже значения являются корректными значениями для поля надписи:
```
<ITA>Rochester</ITA>
```
```
<FNT size='14'>C</FNT>olorado
```
```
<CLR red = '255'>Paul &amp; Mary</CLR>
```

Доступные теги форматирования текста

В ArcGIS Pro поддерживаются следующие элементы и теги форматирования. Щелкайте по ссылкам в таблице, чтобы перейти к полному описанию. Примеры синтаксиса для аннотаций и надписей приведены для каждого тега. Синтаксис аннотаций применяется к тексту в компоновке страницы, к значениям полей, используемых для надписывания объектов, а также для аннотаций. Синтаксис надписей применяется к динамическим надписям. Во всех примерах синтаксиса надписей форматированный текст можно заменить на поле надписи.


Элемент	Выходные данные
Имя и/или размер шрифта <FNT></FNT>
Цвет (RGB) <CLR></CLR>
Цвет (CMYK) <CLR></CLR>
Цвет (SPOT) <CLR></CLR>
Полужирное начертание <BOL></BOL>
Курсив <ITA></ITA>
Подчеркивание <UND></UND>
Все заглавные <ACP></ACP>
Малые заглавные <SCP></SCP>
Верхний индекс <SUP></SUP>
Нижний индекс <SUB></SUB>
Расстояние между символами/буквами <CHR></CHR>
Ширина символов/букв <CHR></CHR>
Расстояние между словами <WRD></WRD>
Выравнивание <ALIGN></ALIGN>
Междустрочное расстояние <LIN></LIN>
Отмена полужирного начертания <_BOL></_BOL>
Отмена курсива <_ITA></_ITA>
Отмена подчеркивания <_UND></_UND>
Отмена верхнего индекса <_SUP></_SUP>
Отмена нижнего индекса <_SUB></_SUB>
Фон <BGD></BGD>
Вертикальная азбука Морзе<VMC></VMC>
Часть <PART></PART>
Базовый <BSE></BSE>

Имя и/или размер шрифта

<FNT></FNT>


Атрибуты	Примечания
name = {TrueType font} style = {Font style} size = {1} scale = {1-}	Задайте имя, стиль, размер, масштаб или все сразу. Значение стиля — это имя стиля шрифта, либо, при использовании шрифта переменной, значение указанной вариации. При использовании вариаций наведите указатель мыши на ось, чтобы увидеть название тега. Пример надписи: «<FNT name = ‘Bahnschrift’ wght = ‘465’>» + «Вес текста = 465» + «</FNT>» Пример аннотации: <FNT name = «Bahnschrift» wght = «465» >Вес текста = 465</FNT>

Пример результата

Синтаксис аннотации

<FNT name = «Arial» style = «Regular» size = «12»>Text size = 12</FNT> <FNT name = «Arial» scale=»200″> Text scale = 200</FNT>

Синтаксис налписи

«<FNT name = ‘Arial’ style = ‘Regular’ size = ’12’>» + «Text size = 12» + «</FNT>» + «<FNT name = ‘Arial’ scale=’200′>» + «Text scale = 200» + «</FNT>»

Цвет (RGB)

<CLR></CLR>


Атрибуты	Примечания
red, green, blue = {0–255} alpha = {0–100}	Значение alpha определяет прозрачность текста. Пропущенным атрибутам red, green, blue будет присвоено 0 Пропущенному атрибуту alpha будет присвоено = 100

Пример результата

Синтаксис аннотации

Синтаксис налписи

«<CLR red = ‘255’>» + «Text» + «</CLR>»

Цвет (CMYK)

<CLR></CLR>


Атрибуты	Примечания
голубой, пурпурный, желтый, черный alpha = {0–100}	Значение alpha определяет прозрачность текста. Пропущенные атрибуты считаются = 0 Пропущенному атрибуту alpha будет присвоено = 100

Пример результата

Синтаксис аннотации

Синтаксис налписи

«<CLR magenta = ‘100’>» + «Text» + «</CLR>»

Цвет (SPOT)

<CLR></CLR>


Атрибуты	Примечания
spotname, alpha = {0–100}, tint = {0–100} голубой, пурпурный, желтый, черный красный, зеленый, синий	Используется для настройки плашечного цвета при печати. Значение alpha — непрозрачность текста. Рекомендуется оставить непрозрачность на уровне 0 (полностью непрозрачный цвет), если у вас нет специальных инструкций от поставщика услуг печати. Значение оттенка говорит об относительном количестве чернил (темнота). Альтернативный цвет используется для отображения плашечного цвета на экране и на любом устройстве вывода, которое не поддерживает плашечные цвета. Этот цвет указывается с помощью значений RGB или CMYK, которые визуально аналогичны чернилам плашечных цветов. Пропущенному атрибуту alpha будет присвоено = 100 Пропущенные атрибуты оттенка считаются = 100 Пропущенные атрибуты считаются = 0

Пример результата

Синтаксис аннотации

H2O

Синтаксис налписи

«H» + «» + «2» + «O»

Расстояние между символами/буквами

<CHR></CHR>


Атрибуты	Примечания
spacing = {1-}	Выражается в процентах выравнивания от стандартного интервала между знаками/буквами; 0 означает отсутствие изменений.

Пример результата

Синтаксис аннотации

Синтаксис налписи

«<CHR spacing = ‘200’>» + «Text» + «</CHR>»

Ширина знака/буквы

<CHR></CHR>


Атрибуты	Примечания
width = {1-}	Выражается в процентах относительно стандартной ширины символов/букв; 0 означает отсутствие изменений.

Пример результата

Синтаксис аннотации

Синтаксис налписи

«<CHR>» + «Text» + «</CHR>»

Расстояние между словами

<WRD></WRD>


Атрибуты	Примечания
spacing = {1-}	Выражается в процентах от расстояния между словами; 100 означает обычное расстояние.

Пример результата

Синтаксис аннотации

<WRD spacing = «200»>Extra Word Spacing</WRD>

Синтаксис налписи

«<WRD spacing = ‘200’>» + «Extra Word Spacing» + «</WRD>»

Выровнять

<ALIGN></ALIGN>


Атрибуты	Примечания
horizontal = {left, right, center, justify}	Горизонтальные атрибуты: Слева – выравнивает все строки абзаца по левой границе области текста. Используется по умолчанию. Справа – выравнивает все строки абзаца по правой границе области текста. По центру – выравнивает все строки абзаца по центру между правой и левой границами области текста. По ширине – размещает слова для всех строк в абзаце (кроме последней неполной строки) таким образом, чтобы они растягивались от левого до правого краев текстовой области. Пропущенный атрибут по горизонтали игнорируется.

Пример результата

Синтаксис аннотации

The top two lines have no tags. The bottom line is aligned <ALIGN horizontal = «right»>to the right.</ALIGN>

Синтаксис налписи

«The top two lines have no tags.» + textformatting.newline + «The bottom line is aligned» + textformatting.newline + «<ALIGN horizontal = ‘right’>» + «to the right.» + «</ALIGN>»

Расстояние между строками

<LIN></LIN>


Атрибуты	Примечания
leading = {1-} leading_type = {extra, exact, multiple}	Выражается относительно стандартного междустрочного расстояния, в пунктах; 0 пунктов означает отсутствие изменений. Тип межстрочного расстояния: Экстра — ведущее значение представлено дополнительными точками перед первой строкой абзаца и между каждой строкой абзаца, но не после последней строки. Значения могут быть отрицательными, чтобы уменьшить расстояние между строками. Используется по умолчанию. Точно – высота всех строк точно соответствует указанному значению. Эта опция может уплотнять или разделять строки в зависимости от того, меньше или больше это значение, чем размер шрифта. Умножить – указанное значение выступает как множитель для размера строки. Значения могут быть меньше 1.

Пример результата

Синтаксис аннотации

<LIN leading = «25» leading_type = «extra»>Text with a leading value of 25 points</LIN>

Синтаксис налписи

«<LIN leading = ’25’ leading_type = ‘extra’>» + «Text with a leading value of 25 points» + «</LIN>»

Отмена полужирного

<_BOL></_BOL>

Пример результата

Пример результата

Синтаксис аннотации

<_SUP> This text is regular but </_SUP> this text is superscript.

Синтаксис налписи

«<_SUP>» + «This text is regular but» + «</_SUP>» + » this text is superscript.» + «»

Отмена нижнего индекса

<_SUB></_SUB>

Пример результата

Синтаксис аннотации

<_SUB> This text is regular but </_SUB> this text is subscript.

Синтаксис налписи

«<_SUB>» + «This text is regular but» + «</_SUB>» + » this text is subscript.» + «»

Фон

<BGD></BGD>


Атрибуты	Примечания
red, green, blue = {0–255} cyan, magenta, yellow, black = {0–100} alpha = {0–100} outline_red, outline_green, outline_blue = {0–255} outline_cyan, outline_magenta, outline_yellow, outline_black = {0–100} outline_alpha = {0–100} width = {Double} padding = {Double}	Значение alpha — непрозрачность фона. Значение outline_alpha — непрозрачность рамки. width – задает ширину рамки в точках. Значение padding — расстояние между рамкой и краем фона в точках. Пропущенным атрибутам red, green, blue будет присвоено 0 Пропущенным атрибутам cyan, magenta, yellow, black присваивается 0 Пропущенным атрибутам alpha и outline_alpha присваивается = 100

Пример результата

Синтаксис аннотации

Синтаксис налписи

«<CLR red=’255′ green=’236′ blue=’0′ alpha=’100′><BGD red=’0′ green=’0′ blue=’0′ alpha=’100′>» + «B» + «</BGD></CLR><CLR red=’255′ green=’255′ blue=’255′ alpha=’100′><BGD red=’230′ green=’0′ blue=’0′ alpha=’100′>» + «15-33» + «</BGD></CLR>»

Вертикальная азбука Морзе

<VMC></VMC>


Атрибуты	Примечания
x_offset = {1-} y_offset = {1-}	Значение x_offset является десятичным значением сдвига по X в точках. Значение y_offset является десятичным значением сдвига по Y в точках. Доступно только при использовании типа составная выноска.

Пример результата

Синтаксис аннотации

Синтаксис налписи

«<VMC>» + «TUS» + «</VMC>»

Часть

<PART></PART>


Атрибуты	Примечания
position = {middle, topleft, top, topright, right, bottomright, bottom, bottomleft, left, floating] h_align = {left, right, center, justify} v_align = top, center, baseline, bottom} x_offset = {1-} y_offset = {1-} split_offset = {1} boxed = {true, false}	Значение x_offset является десятичным значением сдвига по X в точках. Значение y_offset является десятичным значением сдвига по Y в точках. split_offset — это промежуток между границей выноски и любой частью текста, пересекающей границу, измеренный в точках. Если значение задано шире, чем ширина выноски, то связующие линии выноски нарисованы не будут. Значение в рамке говорит о том, сохранить ли часть внутри выноски с разделительной линией, чтобы отделить ее от среднего элемента. Доступно только при использовании типа составная выноска. Теги смещения и выравнивания перезаписывают любые настройки символа.

Пример результата

Синтаксис аннотации

<PART position=»middle»>Middle Element</PART><CLR blue=»200″><PART position=»top»>Top</PART><PART position=»topleft»>TopL</PART><PART position=»topright»>TopR</PART><PART position=»left»>Left</PART><PART position=»right»>Right</PART><PART position=»bottom»>Bottom</PART><PART position=»bottomleft»>BottomL</PART><PART position=»bottomright»>BottomR</PART><PART position=»floating» h_align=»center» v_align=»center» x_offset=»0″ y_offset=»-10″>Floating</PART></CLR>

Синтаксис налписи

«<PART position=’middle’>» + «Middle Element» + «</PART><CLR blue=’200′><PART position=’top’>Top</PART><PART position=’topleft’>» + «TopL» + «</PART><PART position=’topright’>» + «TopR» + «</PART><PART position=’left’>» + «Left» + «</PART><PART position=’right’>» + «Right» + «</PART><PART position=’bottom’>» + «Bottom» + «</PART><PART position=’bottomleft’>» + «BottomL» + «</PART><PART position=’bottomright’>» + «BottomR» + «</PART><PART position=’floating’ h_align=’center’ v_align=’center’ x_offset=’0′ y_offset=’-10′>» + «Floating» + «</PART></CLR>»

Основная

<BSE></BSE>


Примечания
Обозначает строку основного текста, используемую для первичного размещения надписей (только Maplex Label Engine).

Пример результата

Синтаксис аннотации

<BSE>College Station</BSE>Population: 67890 Median Age: 21.9

Синтаксис налписи

«<BSE>» + «College Station» + «</BSE>» + TextFormatting.NewLine + «Population: 67890» + TextFormatting.NewLine + «Median Age: 21.9»

Связанные разделы

Отзыв по этому разделу?

Какой тег делает текст жирным в html

HTML тег

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

Содержимое элемента браузеры отображают жирным текстом. С помощью CSS можно изменять внешний вид содержимого элемента по вашему желанию, таким образом, изменив, заданное по умолчанию, жирное начертание текста, размещенного в элементе. Если вам необходимо выделить текст именно жирным шрифтом, то для этой цели лучше воспользоваться CSS свойством font-weight.

Примечание: согласно спецификации HTML5, тег должен быть использован в качестве последнего средства, когда нет других тегов являющихся более целесообразными.

Теги strong и b, важность и выделение

На этом возможности выделения слов и фраз в тексте не заканчиваются. Вы научились выделять фразы курсивом, а теперь давайте разберёмся с выделением текста жирным.

Теги и (сокращение от «bold») предназначены для выделения слова или фразы. Отображаются оба тега одинаково, они выделяют текст жирным.

Тег указывает на важность отмеченного текста. Он может использоваться для выделения предупреждений или части документа, которую пользователь должен увидеть раньше остального. При этом обозначение части текста тегом не должно изменять смысла предложения.

Тег предназначен для выделения текста с целью привлечения к нему внимания, но без придания ему особой важности. Использовать его нужно только в случае, когда остальные теги выделения не подходят. Типичный пример — выделение вводного предложения статьи.

Лучше всего отличия этих тегов будут заметны людям, которые используют средства доступности, в частности, слепым и слабовидящим. Скринридер при чтении сайта будет выделять слова с тегом интонационно, в отличие от простого выделения с помощью .

То же самое касается тегов и . Тег «читалка» будет выделять интонацией.

index.html Сплит-режим
style.css Сплит-режим

Спасибо! Мы скоро всё исправим)

Код изменился, нажмите «Обновить» или включите автозапуск.

Вы перешли на другую страницу

Кликните внутри мини-браузера, чтобы поставить фокус в это окно.

Оберните текст первого абзаца в тег .
Оберните слово CSS в третьем абзаце в тег .

Оберните фразу всего лишь в подходящий по смыслу тег.

Если у вас возникли сложности во время прохождения задания, то вы можете обратиться за помощью на наш форум или задать вопрос в Телеграм-чате.

Форматирование текста в html

От автора: HTML предоставляет достаточно возможностей для форматирования текста. Например, его можно сделать с жирным или курсивным начертанием, подчеркнуть или вывести с учетом пробелов. Форматирование текста в html осуществляется с помощью нескольких тегов, которые в этой статье хотелось бы обсудить подробнее.

Жирный шрифт

Для того чтобы вывести в html буквы жирным шрифтом, нужно его заключить в специальные теги, которые для этой цели предназначены. Как ни странно, но парные теги и выполняют одно и то же действие – делают содержимое, которое вписано в них, жирным. Так зачем тогда для одного и того же действия придуманы разные теги?

Дело в том, что b и strong немного отличаются. Тег был создан для того, чтобы просто помечать нужный текст жирным шрифтом, но при этом не добавлять ему какой-то важности по сравнению с другими частями. Проще говоря, это просто тег для изменения внешнего вида и ни для чего более.

Strong имеет немного другой смысл, добавляя тексту важности. В этом плане тег можно назвать логическим или семантическим. Заключая определенные слова в strong можно подчеркнуть их важность, выделить среди всей статьи.

Курсив

Для вывода слов в курсивном начертании нужно использовать теги и . Тут ситуация такая же, как и вышеописанная. Тег влияет только на внешний вид текста, не добавляя ему особого смысла. Em же позволяет логически выделить слова.

Практический курс по верстке адаптивного сайта с нуля!

Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3

Например, в речевых браузерах такой фрагмент может быть отмечен немного по-другому, чем если бы его просто пометили как курсив с помощью .

Текст в верхнем и нижнем индексах

Иногда появляется необходимость вывести какие-то буквы, цифры или символы в верхнем или нижнем индексе. Для этого стоит применять парные теги и . Первый выводит символы в верхнем индексе, а второй, соответственно, в нижнем. Вот и вся наука.

Вывод текста с сохранением форматирования

По умолчанию в html-документе любое количество пробелов преобразовывается в один. В большинстве случаев это вполне оправдано, так как код не является самым удобным местом для форматирования информации. Но все же может возникнуть необходимость записать текст так, чтобы он вывелся ровным счетом так же, как записан в редакторе.

Для этого его заключают в парный контейнер <pre>. Теперь будут учитываться все пробелы и переносы строк. Ах да, еще шрифт может поменяться на моноширинный.

Рис. 1. Этот отрывок был написан без переносов строк с помощью
. Как видите, текст в pre отображается так, как он набран в редакторе.

Вообще в css есть гораздо более функциональное свойство, которое позволяет управлять отображением пробелов в нужном фрагменте более широко. Это свойство white-space. Хотя статья в основном об html-тегах, давайте все-таки рассмотрим его значения:

Nowrap – все будет выводиться одной строкой без переносов. Перенести можно только вручную. Например, добавив к строке тег br.

Pre – будет выводиться абсолютно так же, как он выводиться в pre. Если строка не влезает в окно браузера, то она продолжит тянуться, образуя горизонтальную прокрутку.

Pre-wrap – более умное поведение текста, все пробелы сохраняются, но слова автоматом переносятся на новую строку, если перестают помещаться по ширине в свой блок-родитель.

Вот такие вот есть значения. Так что если вам нужно будет вывести фрагмент с пользовательским форматированием, лучше всего использовать значение pre-wrap.

Подчеркнутый текст

Для подчеркивания в html есть еще один тег — ins. Можно использовать его, а можно реализовать подчеркивания с помощью css-свойства text-decoration. Кстати, это позволяет подчеркнуть нужный текст не только снизу, но и сверху, если это будет необходимо.

Практический курс по верстке адаптивного сайта с нуля!

Изучите курс и узнайте, как верстать современные сайты на HTML5 и CSS3

Зачеркнутый текст

Сначала в html для этого применяли тег strike, но сегодня он немного устарел и вместо него лучше использовать укороченный вариант — s. Также язык разметки предлагает нам еще один тег – del. Он тоже выводит зачеркнутый текст, но был создан для того, чтобы показать, какие части документа были исправлены.

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

Комбинирование

Все теги форматирования можно комбинировать между собой и в результате получить жирный курсивный текст, слова в верхнем индексе с подчеркиванием или зачеркнутую цифру в нижнем индексе. Давайте для примера наложим побольше команд на какое-нибудь слово.

HTML – Форматирование текста html-документа и теги форматирования страницы

Если Вы пользуйтесь текстовым редактором, например, таким как Microsoft Word или Microsoft Excel, то Вы должны быть знакомы с форматированием текста и как сделать текст жирным (полужирным), наклонным (курсивом), зачеркнутым или подчеркнутым. Это всего лишь четыре из одиннадцати доступных вариантов, указывающих, как можно форматировать текст в HTML и XHTML.

Полужирный или жирный текст

Полужирный шрифт или жирный шрифт в HTML можно задать с помощь двух тегов … и …. Все, что находится в тегах … и … отображается в HTML жирным текстом (полужирным), как показано ниже:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример выделения жирным текста и шрифта в HTML</title>
  </head>
  <body>
    <p>С помощью тега b делаем <b>жирный шрифт</b>. </p>
    <p>С помощью тега strong делаем <strong>текст жирным</strong>.</p>
  </body>
</html>

Получим следующий результат:

Курсив – наклонный текст или шрифт

Сделать в HTML курсивом текст можно с помощь двух тегов … и …. Все, что находится в тегах курсива … и … отображается в HTML наклонным текстом (шрифтом), как показано ниже:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример выделения курсивом текста и шрифта в HTML</title>
  </head>
  <body>
    <p>С помощью тега i делаем <i>наклонный текст или шрифт</i>.</p>
    <p>С помощью тега em делаем <em>текст курсивом</em>.</p>
  </body>
</html>

Получим следующий результат:

Подчеркнутый текст

Подчеркнуть текст в HTML можно с помощь тега . ... Все, что находится внутри тега … отображается в HTML подчеркнутым текстом (шрифтом), как показано ниже:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример подчеркивания текста в HTML</title>
  </head>
  <body>
    <p>С помощью тега u делаем <u>подчеркнутый текст или слово</u>.</p>
  </body>
</html>

Получим следующий результат:

Зачеркнутый текст

Зачеркнуть текст в HTML можно с помощь тега <strike>…</strike>. Все, что находится внутри тега <strike>…</strike> отображается в HTML зачеркнутым текстом (шрифтом), как показано ниже:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример зачеркивания текста в HTML</title>
  </head>
  <body>
    <p>С помощью тега strike делаем <strike>зачеркнутый текст</strike>. </p>
  </body>
</html>

Получим следующий результат:

Моноширинный шрифт

Содержимое элемента <tt>…</tt> записывается в HTML моноширинным шрифтом. Большинство шрифтов обладают переменной шириной, потому что разные буквы имеют разную ширину (например, буква «щ» шире буквы «г»). Однако в моноширинном шрифте каждая буква имеет одинаковую ширину.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример моноширинного шрифта в HTML</title>
  </head>
  <body>
    <p>С помощью тега tt делаем <tt>моноширинный шрифт</tt>.</p>
  </body>
</html>

Получим следующий результат:

Верхний индекс

Содержимое тега … отображается в HTML в верхнем индексе. Тег верхнего индекса в HTML имеет тот же размер шрифта, который используют окружающие его символы, но использует он только половину их высоты. Данный элемент хорошо подходит когда необходимо, например, написать в HTML степень числа.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример верхнего индекса в HTML</title>
  </head>
  <body>
    <p>С помощью тега sup делаем верхний<sup>индекс</sup> или степень числа, например, 2<sup>3</sup>.</p>
  </body>
</html>

Получим следующий результат:

Нижний индекс

Содержимое тега … отображается в HTML в нижнем индексе. Тег нижнего индекса в HTML имеет тот же размер шрифта, который используют окружающие его символы, но использует он только половину их высоты.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример нижнего индекса в HTML</title>
  </head>
  <body>
    <p>С помощью тега sub делаем нижний<sub>индекс</sub>. </p>
  </body>
</html>

Получим следующий результат:

Вставленный текст

Содержимое внутри тега <ins>…</ins> отображается в HTML как вставленный текст.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример вставленного текста в HTML</title>
  </head>
  <body>
    <p>Хочу зарабатывать <del>много</del> <ins>очень много</ins> денег.</p>
  </body>
</html>

Получим следующий результат:

Удаленный текст

Содержимое внутри тега <del>…</del> отображается в HTML как удаленный текст.

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример удаленного текста в HTML</title>
  </head>
  <body>
    <p>Хочу зарабатывать <del>много</del> <ins>очень много</ins> денег. </p>
  </body>
</html>

Получим следующий результат:

Большой текст

Содержимое тега <big>…</big> отображается в HTML большим текстом, на один размер шрифта больше, чем остальная часть окружающего его текста, как показано ниже:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример большого текста в HTML</title>
  </head>
  <body>
    <p>С помощью тега big делаем <big>текст больше</big>.</p>
  </body>
</html>

Получим следующий результат:

Маленький текст

Содержимое внутри тега … отображается в HTML маленьким текстом, на один размер шрифта меньше, чем остальная часть окружающего его текста, как показано ниже:

Пример

<!DOCTYPE html>
<html>
  <head>
    <title>Пример маленького текста в HTML</title>
  </head>
  <body>
    <p>С помощью тега small делаем <small>текст меньше</small>. </p>
  </body>
</html>

Получим следующий результат:

Группировка элементов и содержимого страницы в HTML

Элементы <div> и  позволяют в HTML группировать несколько элементов для создания секций или подсекций страницы.

Например, Вы можете поместить все ссылки на странице в тег <div>, чтобы указать, что все элементы в этом теге <div> относятся к меню. Затем Вы можете задать стиль тегу <div>, чтобы элементы отображались с использованием специального набора правил стиля (CSS).

Пример с тегом <div>

<!DOCTYPE html>
<html>
  <head>
    <title>Пример группировки элементов и текста в HTML</title>
  </head>
  <body>
    <div>
      <a href="/index.html">ГЛАВНАЯ</a> / 
      <a href="/about.html">О НАС</a> / 
      <a href="/contacts. html">КОНТАКТЫ</a>
    </div>
  
    <div>
      <h2>Название статьи</h2>
      <p>Содержимое страницы...</p>
    </div>
  </body>
</html>

Получим следующий результат:

С другой стороны, элемент может использоваться для группировки только встроенных элементов. Итак, если у Вас есть часть предложения или абзаца (параграфа), который Вы хотите объединить, Вы можете использовать элемент следующим образом:

Пример с тегом

<!DOCTYPE html>
<html>
  <head>
    <title>Пример группировки элементов и текста в HTML</title>
  </head>
  <body>
    <p>Группировки элементов с помощью <span>тега span</span>.</p>
  </body>
</html>

Получим следующий результат:

Эти теги обычно используются с CSS, чтобы Вы могли задать стиль к секции страницы.

Источник: HTML — Formatting.

Основные HTML теги форматирования текста — выделение текста жирным и курсивом; параметры размера, цвета и шрифта; абзац и теги заголовков

В этой статье речь пойдет о тегах форматирования текста. Яркими примерами являются выделение текста жирным или курсивом. Также мы рассмотрим влияние некоторых тегов на внутреннюю оптимизацию сайта и правила их написания. Про то, что такое теги и атрибуты вы можете прочитать в приведенной статье. Кстати, вы можете встретить подобные элементы оформления текста вы можете во многих текстовых редакторах, например в Ворде.

Теги разделяются на 2 вида: блочные и строчные. При использовании первых, вы сможете изменить содержание части текста (строки, отдельные фрагменты или же слова), а вторые являются структурой HTML-документа. Теги форматирования, которые мы рассмотрим в этой статье, преимущественно строчные.

Содержание

Правила и порядок написания тегов
Выделение текста жирным и курсивом — теги , , и
Теги выделения текста чертой — , <s> и <strike>
Тег и атрибуты — параметры шрифта текста
Блочные элементы оформления текста — заголовки <h2>-<h6>, абзац

Правила и порядок написания тегов

Вы уже знаете, что такое открывающий и закрывающий теги. Если нет, то прочтите статью, приведенную в самом начале этого материала. Если коротко, то теги бывают двух видов: одиночные (например, перенос на новую строку
) и контейнерные (парными). Так вот, все теги форматирования текста являются парными. Это означает, что любой элемент имеет открывающий и закрывающий теги, а выделяемый фрагмент должен быть помещен между ними. Например, правильное выделение фразы будет выглядеть так:

 Выделенный фрагмент 

Когда браузер обработает этот фрагмент, то вы увидите вот такой текст: Выделенный фрагмент. Кстати, в RSS ленте все теги не отображаются (что такое RSS лента и новостная рассылка).

Главное при написании тегов — не забывайте их закрывать. Иначе весь текст на странице будет выделен жирным (в примере с тегом ). Но бывают такие случаи, когда нужно выделить определенный фрагмент и жирным и курсивом одновременно. Но тега, выполняющего это действие, не существует. Выход из этой ситуации один: использовать два тега одновременно. В каком порядке их использовать значения не имеет. Поэтому, написав текст с тегами так:

 Выделенный фрагмент

или вот так:

 Выделенный фрагмент

Вы все равно получите Выделенный фрагмент курсивом и жирным одновременно. Однако, предпочтительно использовать первый вариант, потому что изначально он был единственным и правильным. Также не стоит забывать о том, что каждый браузер может обрабатывать теги по-разному (что такое браузер и какой них самый лучший), в зависимости от настроек. А теперь перейдем к самим тегам форматирования

Выделение текста жирным и курсивом — теги , , и

Самые популярные теги форматирования текста — выделение его жирным и курсивом. Обычно их используют для придания важности какому-либо фрагменту. Первый случай служит для выделения фрагмента, содержащего полезную информацию или ключевые слова. Курсив применяется в тех же целях, что и жирный текст, но информация менее важна, потому что курсив на фоне основного текста менее заметен, нежели жирный текст.

Рассмотрим для начала выделение текста жирным. Для этого действия используется два тега — и . Разницы во внешнем виде нет. Хотя, учитывая то, что любой браузер может интерпретировать каждый элемент по-своему, вы сможете увидеть какие-либо отличия. Вот как выглядит текст в тегах — и в уже обработанном браузером виде:

Текст в тегах strong

Текст в тегах b

А вот как выглядят две данные строчки в исходном коде страницы:

Текст в тегах strong 

Текст в тегах b 

Ту же ситуацию мы можем наблюдать в случае с тегами выделения курсивом и . Попытайтесь найти отличия между двумя примерами:

Текст в тегах em

Текст в тегах I

А вот исходный код:

Текст в тегах em 

Текст в тегах I 

Итак, рассмотренные теги выделения жирным и курсивом фактически не отличаются, но зачем же тогда нам, например, тег если есть ? Ведь последний содержит всего один символ (не считая скобок) и, следовательно, легче в написании. А все дело в том, что теги  и  влияют на внутреннюю оптимизацию сайта. Если вы будете окружать этими тегами ключевые слова, то это благоприятно скажется на продвижении сайта. Главное не переусердствовать — максимум в тексте должно быть 5% жирного текста в теге , и столько же и курсива в теге .

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

Теги выделения текста чертой — , <s> и <strike>

Теперь рассмотрим несколько тегов, которые используют черту в оформлении текста. Самый известный вам из текстовых редакторов — тег  или подчеркивание. Влияние на ранжирование этот тег не оказывает (насколько я знаю), а вот выделить какой-либо текст и заострить на нем внимание поможет. Пример использования данного тега я привел чуть выше.

Еще два схожих по назначению тега — <s> и <strike>. Оба выполняют функцию ~~зачеркивания~~ текста. Использовать этот тег можно в любых ситуациях: если вы обновляете документ (а точнее его часть), то можно перечеркнуть старое и добавить новое; если вы собираетесь написать нечто, отходящее от темы материала; что-то не соответствующее морально-этическим нормам.

Отличия же этих двух тегов заключаются только в их написании, вследствие чего предпочтительней использовать первый, т.к. во-первых удобнее писать, а во-вторых, на вашей странице будет находиться меньшее количество HTML-кода, а поисковики это любят.

Тег и атрибуты — параметры шрифта текста

Теперь рассмотрим тег, который не используется без атрибутов. С помощью его вы сможете задать параметры для определенного фрагмента текста. Вообще, сейчас предпочтительней использовать CSS (каскадные таблицы стилей), т.к. с помощью них можно сильно сократить весь HTML код страницы. Итак, рассмотрим тот самый тег . Для него существует всего три атрибута:

face — сам шрифт. Например, Arial, Courier или Verdana. Можно перечислить несколько, т.к. не у всех пользователей имеется обширный набор шрифтов, а написав несколько в атрибуте face, браузер сможет выбрать, какой использовать, а точнее — какой присутствует в системе;
size — атрибут, указывающий размер текста. Может быть выражен как в условных единицах, так и в пикселях;
color — цвет текста. Данный атрибут можно использовать как в HTML-кодах цветов, так и в словесных. Первые имеют вид #FFFFFF (где F — любая цифра или буква от A до F), а вторые записываются простыми словами (например, red — красный).

Так выглядит текст в теге с использованием каждого атрибута:

</pre>

Этот текст имеет размер 6px

<pre></pre>

Этот текст красного цвета

<pre></pre>

Этот текст имеет шрифт Arial

<pre></pre>

Этот текст красного цвета и размера 5px

Блочные элементы оформления текста — заголовки <h2>-<h6>, абзац

Напоследок мы рассмотрим блочные элементы, которые используются практически в каждом документе. Это теги заголовков и абзаца. Рассмотрим первое. Заголовки бывают 6-ти видов и каждый имеет свой тег. Каждый вид носит лишь свой порядковый номер и записывается с помощью тегов <h2>, <h3>,…, <h6>.

Вот как выглядят все заголовки в обработанном виде:

Цифра после слова заголовок соответствует цифре в теге <h*>. Заголовки оказывают огромное влияние на на внутреннюю оптимизацию, поэтому заключайте в теги <h*> ключевые слова. Особенностей этого дела довольно много, о чем я расскажу в последующих статьях.

А теперь поговорим про тег выделения абзаца . Функция данного тега заключается в отделении текста между и от другого такого же текста пустой строкой. Если посмотреть исходный код какого-либо документа, то вы можете увидеть следующее:

В зеленых прямоугольниках один абзац, в красных — другой. А вот как этот код выглядит после обработки браузером (стрелочка указывает на пустую строку):

В итоге мы получаем довольно заметное отделение одного абзаца от другого, что идет на пользу — чтение становится более удобным.

Вот и подошла к концу статья про теги форматирования документа. Их намного больше, нежели я описал в этом материале. Просто о некоторых нужно рассказать довольно много, вследствие чего им будет посвящены отдельные статьи с полным обзором.

Подсказки по редактированию | LessWrong на русском

Разрешённые HTML-теги: <a> <strike> <cite> <blockquote> <code> <ul> <ol> <li> <dl> <dt> <dd> <img> <h2> <h3> <h4> <h5> <h5> <h6> <table> <tbody> <thead> <tfoot> <tr> <td>

Этот сайт поддерживает HTML. В то время как полное изучение HTML может быть весьма непростым, изучение небольшого числа основных тегов HTML не составит сложности. Эта таблица иллюстрирует примеры использования каждого тега на этом сайте.

Для более подробной информации обратитесь к спецификациям HTML W3C или найдете в любимом поисковике другие сайты, обучающие HTML.

Описание тега Вы пишете Вы получаете

Якоря используются для создания ссылок на другие страницы. <a href="https://lesswrong.ru">LessWrong на русском</a> LessWrong на русском

Курсив Курсив Курсив

Жирный Жирный Жирный

Справки для тега strike нет.

Цитата <cite>Цитата</cite> Цитата

Цитата блоком

<blockquote>Цитата блоком</blockquote>

Цитата блоком

Для отображения исходных текстов программ <code>Исходный код</code> Исходный код

Ненумерованный список – используйте <li> для начала каждого элемента списка

<ul> <li>Первый элемент</li> <li>Второй элемент</li> </ul>

Первый элемент
Второй элемент

Нумерованный список – используйте <li> для начала каждого элемента списка

<ol> <li>Первый элемент</li> <li>Второй элемент</li> </ol>

Первый элемент
Второй элемент

Справки для тега li нет.

Списки определений похожи на другие списки HTML. <dl> начинает список определений, <dt> начинает определяемый термин и <dd> начинает описание определения.

<dl> <dt>Первый термин</dt> <dd>Первое определение</dd> <dt>Второй термин</dt> <dd>Второе определение</dd> </dl>

Первый термин: Первое определение
Второй термин: Второе определение

Справки для тега dt нет.

Справки для тега dd нет.

Справки для тега span нет.

Справки для тега img нет.

Заголовок <h2>Заголовок</h2>

Заголовок <h3>Подзаголовок</h3>

Заголовок

<h4>Заголовок третьего уровня</h4>

Заголовок третьего уровня

Заголовок

<h5>Заголовок четвёртого уровня</h5>

Заголовок четвёртого уровня

Заголовок

<h5>Заголовок пятого уровня</h5>

Заголовок пятого уровня

Заголовок

<h6>Заголовок шестого уровня</h6>

Заголовок шестого уровня

По умолчанию теги параграфов добавляются автоматически, так что используйте этот тег для создания дополнительных параграфов.

Первый параграф. Второй параграф.

Первый параграф.

Второй параграф.

Таблица

<table> <tr><th>Заголовок таблицы</th></tr> <tr><td>Ячейка таблицы</td></tr> </table>

Заголовок таблицы
Ячейка таблицы

Справки для тега tbody нет.

Справки для тега thead нет.

Справки для тега tfoot нет.

Справки для тега tr нет.

Справки для тега td нет.

Большинство малоиспользуемых символов могут быть введены безо всяких проблем.

Если проблемы всё же возникают, попробуйте использовать сущности HTML. Типичный пример выглядит так: & для символа амперсанда &. Полный список сущностей HTML смотрите на соответствующей странице спецификации HTML. Некоторые из доступных символов:

Описание знака	Вы пишете	Вы получаете
Амперсанд	`&`	&
Больше чем	`>`	>
Меньше чем	`<`	<
Кавычка	`"`	«

Разница между сильным и полужирным тегом в HTML

Просмотреть обсуждение

Улучшить статью

Сохранить статью

Уровень сложности: Easy
Последнее обновление: 06 июн, 2022

Читать
Обсудить

Посмотреть обсуждение

Улучшить статью

Сохранить статью

Тег HTML strong: Тег strong является одним из элементов HTML, используемых для форматирования текстов HTML. Он используется, чтобы показать важность текста, выделяя его жирным шрифтом или выделяя его семантически.

Синтаксис:

  Содержание...

Полужирный тег HTML: Тег полужирный или также является одним из элементов форматирования HTML. Текст, написанный под тегом , выделяется жирным шрифтом, чтобы привлечь внимание.

Синтаксис:

  Содержание...

Основное различие между этими двумя тегами заключается в том, что тег strong семантически подчеркивает важное слово или часть слов, в то время как тег 9Тег 0051 жирный — это просто смещенный текст, оформленный обычным шрифтом жирный . Ниже приведен код, показывающий эту разницу.

Example 1:

HTML

< html >

< head >

< стиль >

body {

text-align:center;

}

h2 {

9009 0 6 зеленый;

}

Стиль >

Голов0070

< body >

< h2 >GeeksforGeeks h2 >

Этот текст важен!

Strong > P >

<999. 9009> > > >. P >

Body >

9003

HTML

HTML > .0070

Вывод:

Хотя нет разницы в отображении обоих тегов, но между ними есть семантическая разница.

Example 2:

HTML

< html >

< head >

< title >b tag title >

< style >

body {

выравнивание текста: по центру;

}

h2 {

цвет: зеленый;

}

style >

head >

< body >

< h2 >Гики для гиков h2 >

Without internet strong >

we can not use gfg

P >

<

0069 p >

GeeksforGeeks: b > A computer

science portal for geeks

стр. >

Body >

HTML > HTML > 0070

Вывод:

Мы хотели показать важность слова «интернет», поэтому использовали тег , а для слова «Geeks просто хотели». выделить текст жирным шрифтом.

Поддерживаемый браузер: Ниже перечислены браузеры, поддерживаемые тегами и .

Chrome
Android
Firefox (Gecko)
Firefox Mobile (Gecko)
Internet Explorer (IE)
Edge Mobile
Opera
Opera Mobile
Safari (Webkit)
Safari Mobile

Пусть мы смотрим в различиях в таблице -

2666666666779667796667796667777767767777777779 тег strong тег жирного шрифта 1. Тег используется для определения текста с высокой важностью важность. 2. Текст внутри этого тега полужирный Он делает любой текст жирным. 3. Поддерживает глобальные атрибуты. Поддерживает атрибуты событий. 4. Поддерживает атрибуты событий. Поддерживает глобальные атрибуты. 5.
Поддерживаемые браузеры: -:
Chrome, Microsoft Edge, Safari, Firefox, Opera Mini
Поддерживаемые браузеры:
Chrome, Microsoft Edge, Safari, Firefox, Opera Mini

инструкция
спросил 2 года, 4 месяца назад
Изменено 2 года, 4 месяца назад
Просмотрено 425 раз
Сегодня я пытался создать мини-сайт на основе персонажа из видеоигры и решил добавить несколько тегов, чтобы разделить контент на разные разделы. Я решил разместить теги на каждой из четырех «способностей», которыми обладает персонаж, и вдруг текст внутри элементов абзаца внутри элементов div стал жирным. Я не верю, что сделал их смелыми сам, кто-нибудь знает, почему это произошло?
Я присвоил тегам div в элементе head атрибут font-weight со значением 400, чтобы решить эту проблему, однако я не думал, что это необходимо.
Я думаю, что упустил из виду что-то основное, и было бы неплохо взглянуть на мою работу другими глазами, чтобы заметить ошибку. Спасибо всем, кто может мне помочь, я публикую код ниже.
корпус { цвет фона: фиолетовый; цвет: персиковый; } картинка { плыть налево; } п { цвет: персиковый; размер шрифта: 20px; } дел { цвет: персиковый; размер шрифта: 20px; вес шрифта: 400; } h4 { размер шрифта: 30px; поле: 0px; оформление текста: подчеркивание; }

Энигма

Enigma — герой из Dota 2.

Способности
<дел>
Малефис

Направляет силу Enigma на цель, заставляя ее получать урон и несколько раз оглушать ее. Экземпляр запускается каждые 2 секунды.

Атрибут	Описание
клавиша доступа	Используется для активации или выделения сочетания клавиш.
autocapitalize	Используется для контроля того, является ли ввод автоматически капитализированным или нет.
автофокус	Используется для обозначения того, что элемент должен быть сфокусирован.
класс	Используется для присвоения имени класса элементу.
contenteditable	Используется для указания, может ли пользователь редактировать содержимое элемента.
contextmenu	Используется для указания контекстного меню для элемента.
data	Используется для хранения пользовательских данных, специфичных для страницы, для элемента.
dir	Используется для указания направления текста элемента.
перетаскиваемый	Используется для указания, можно ли перетаскивать элемент.
dropzone	Используется для указания того, будут ли перетаскиваемые данные копироваться, перемещаться или связываться при перетаскивании.
hidden	Используется для обозначения того, что элемент еще не актуален или уже не актуален.
идентификатор	Используется для указания уникального идентификатора элемента и должен быть уникальным во всем документе.
lang	Используется для указания основного языка текстового содержимого элемента.
проверка орфографии	Используется для указания, может ли элемент проверяться на орфографические ошибки или нет.
стиль	Используется для указания встроенной информации о стиле для элемента.
tabindex	Используется для указания порядка табуляции элемента.
title	Содержит текст, представляющий справочную информацию, относящуюся к элементу, которому он принадлежит.
translate	Используется для указания, следует ли переводить текстовое содержимое элемента.

Attributes	Attributes	Attributes	Attributes
onabort	ondragover	onloadeddata	onreset
onblur	ondragstart	onloadedmetadata	onresize
oncancel	ondrop	onloadstart	onscroll
oncanplay	ondurationchange	onmousedown	onsecuritypolicyviolation
oncanplaythrough	onemptied	onmouseenter	onseeked
onchange	onended	onmouseleave	onseeking
onclick	onerror	onmousemove	onselect
onclose	onfocus	onmouseout	onslotchange
oncontextmenu	onformdata	onmouseover	onstalled
oncopy	oninput	onmouseup	onsubmit
oncut	oninvalid	onpaste	onsuspend
ondrag	onkeydown	onpause	ontimeupdate
ondragend	onkeypress	onplay	ontoggle
ondragenter	onkeyup	onplaying	onvolumechange
ondragexit	onlanguagechange	onprogress	onwaiting
ondragleave	onload	onratechange	onwheel

Жирный тег	Строгий тег
Теги полужирного шрифта () используются только для того, чтобы сделать фрагмент текста визуально жирным в HTML.	Строгие теги () используются для форматирования текста в HTML и показывают важность определенной части текста, семантически выделяя ее.
Жирный тег был сделан для отображения текста жирным шрифтом, поэтому они используются для привлечения внимания читателя.	Сильные теги подчеркивают текст, а также выделяют его жирным шрифтом. Строгие теги помогают HTML понять, что важно.
Полужирные теги предпочтительнее, когда мы хотим выделить жирным только текст.	Применение сильных тегов прекрасно показано в браузерах, созданных для слепых. Браузер может легко понять, какая часть важнее и на чем сделать акцент. Сильные теги предпочтительнее, когда мы хотим выделить определенную часть текста.

Уценка	HTML	Визуализированный вывод
`# Уровень заголовка 1`	`Уровень заголовка 1`
`## Уровень заголовка 2`	`Уровень заголовка 2`	Уровень заголовка 2
`### Уровень заголовка 3`	`Уровень заголовка 3`	Уровень заголовка 3
`#### Уровень заголовка 4`	`Уровень заголовка 4`	Уровень заголовка 4
`##### Уровень заголовка 5`	`Уровень заголовка 5`	Уровень заголовка 5
`###### Уровень заголовка 6`	`Уровень заголовка 6`	Уровень заголовка 6

Уценка	HTML	Визуализированный вывод
`Я просто люблю жирный текст.`	`Мне просто нравится выделение жирным шрифтом.`	Я просто люблю полужирный текст .
`Я просто люблю __жирный текст__.`	`Мне просто нравится выделение жирным шрифтом.`	Я просто люблю полужирный текст .
`Любовьэтосмелая`	`Любовьэтосмелая`	Любовь это полужирный

Уценка	HTML	Визуализированный вывод
`Курсивом выделен текст кошачье мяу.`	`Курсивом обозначено кошачье мяуканье.`	Курсивом выделен текст кошачье мяуканье .
`Выделенный курсивом текст — это кошачье мяуканье.`	`Курсивом обозначено кошачье мяуканье.`	Курсивом выделен текст кошачье мяуканье .
`Акотмяу`	`котмяу`	А кошка мяу

Уценка	HTML	Визуализированный вывод
`Этот текст *действительно важен*.`	`Этот текст действительно важен.`	Этот текст действительно важен .
`Этот текст ___действительно важен___.`	`Этот текст действительно важен.`	Этот текст действительно важен .
`Этот текст __действительно важен__.`	`Этот текст действительно важен.`	Этот текст действительно важен .
`Этот текст _действительно важен_.`	`Этот текст действительно важен.`	Этот текст действительно важен .
`Это действительно*очень*важный текст.`	`Это действительнооченьважный текст.`	Это действительно очень важный текст.

Уценка	HTML	Визуализированный вывод
`1. Первый предмет 2. Второй предмет 3. Третий предмет 4. Четвертый предмет`	`<ол> Первый элемент Второй элемент Третий элемент Четвертый элемент`	Первый предмет Второй предмет Третий предмет Четвертый предмет
`1. Первый предмет 1. Второй предмет 1. Третий предмет 1. Четвертый предмет`	`Первый элемент Второй элемент Третий элемент Четвертый элемент`	Первый предмет Второй предмет Третий предмет Четвертый предмет
`1. Первый предмет 8. Второй предмет 3. Третий предмет 5. Четвертый предмет`	`Первый элемент Второй элемент Третий элемент Четвертый элемент`	Первый предмет Второй предмет Третий предмет Четвертый предмет
`1. Первый элемент 2. Второй элемент 3. Третий элемент 1. Элемент с отступом 2. Элемент с отступом 4. Четвертый элемент`	`Первый элемент Второй элемент Третий элемент Элемент с отступом Элемент с отступом Четвертый элемент`	Первый предмет Второй предмет Третий предмет Элемент с углублением Элемент с углублением Четвертый предмет

Уценка	HTML	Визуализированный вывод
`- Первый предмет - Второй предмет - Третий предмет - Четвертый предмет`	`Первый элемент Второй элемент Третий элемент Четвертый элемент`	Первый предмет Второй предмет Третий предмет Четвертый предмет
`* Первый элемент * Второй элемент * Третий элемент * Четвертый элемент`	`Первый элемент Второй элемент Третий элемент Четвертый элемент`	Первый предмет Второй предмет Третий предмет Четвертый предмет
`+ Первый предмет + Второй предмет + Третий предмет + Четвертый предмет`	`Первый элемент Второй элемент Третий элемент Четвертый элемент`	Первый предмет Второй предмет Третий предмет Четвертый предмет
`- Первый элемент - Второй элемент - Третий элемент - Элемент с отступом - Элемент с отступом - Четвертый элемент`	`Первый элемент Второй элемент Третий элемент Элемент с отступом Элемент с отступом< /li> Четвертый элемент`	Первый предмет Второй предмет Третий предмет Элемент с отступом Элемент с углублением Четвертый предмет

Символ	Имя
\	обратная косая черта
`	обратная кавычка (см. также экранирование обратных кавычек в коде)
*	звездочка
_	подчеркивание
{ }	фигурные скобки
[ ]	кронштейны
< >	угловые скобы
( )	скобки
#	знак фунта
+	плюс
-	знак минус (дефис)
.	точка
!	восклицательный знак
\|	труба (см. также выпускную трубу в таблицах)

Тег жирный: Теги strong и b, важность и выделение — Разметка текста — HTML Academy

Как использовать основные теги HTML для SEO — STRONG, B, EM, I

Сэкономьте время на изучении Serpstat

Теги форматирования текста—ArcGIS Pro | Документация

Синтаксис тегов форматирования

Использование тегов форматирования текста Maplex Label Engine с параметрами форматирования

Дополнительные теги форматирования текста, которые поддерживает Maplex Label Engine

Дополнительные подсказки по построению выражений надписей

Доступные теги форматирования текста

Имя и/или размер шрифта

<FNT></FNT>

Цвет (RGB)

<CLR></CLR>

Цвет (CMYK)

<CLR></CLR>

Цвет (SPOT)

<CLR></CLR>

Полужирный

<BOL></BOL>

Курсив

<ITA></ITA>

Подчеркнутый

<UND></UND>

Все заглавные

<ACP></ACP>

Маленькие заглавные

<SCP></SCP>

Надстрочный

<SUP></SUP>

Подстрочный

<SUB></SUB>

Расстояние между символами/буквами

<CHR></CHR>

Ширина знака/буквы

<CHR></CHR>

Расстояние между словами

<WRD></WRD>

Выровнять

<ALIGN></ALIGN>

Расстояние между строками

<LIN></LIN>

Отмена полужирного

<_BOL></_BOL>

Отмена курсива

<_ITA></_ITA>

Отмена подчёркнутого

<_UND></_UND>

Отмена верхнего индекса

<_SUP></_SUP>

Отмена нижнего индекса

<_SUB></_SUB>

Фон

<BGD></BGD>

Вертикальная азбука Морзе

<VMC></VMC>

Часть

<PART></PART>

Основная

<BSE></BSE>

Связанные разделы

Какой тег делает текст жирным в html

HTML тег <b>

Теги strong и b, важность и выделение

Форматирование текста в html

Жирный шрифт

Курсив

Текст в верхнем и нижнем индексах

Вывод текста с сохранением форматирования

Подчеркнутый текст

Зачеркнутый текст

Комбинирование

HTML – Форматирование текста html-документа и теги форматирования страницы

Полужирный или жирный текст

Пример

Курсив – наклонный текст или шрифт

Пример

Подчеркнутый текст

Пример

Зачеркнутый текст

Пример