files/ru/web/html/element/strong/index.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108

---
title: <strong>
slug: Web/HTML/Element/strong
tags:
  - HTML
  - HTML текстовая семантика
  - strong
  - Важное значение
  - Веб
  - Острая необходимость
  - Справка
  - Элемент
translation_of: Web/HTML/Element/strong
---
<p id="Summary"><span class="seoSummary">Элемент <strong>сильной значимости</strong> (<strong><code>&lt;strong&gt;</code>)</strong> указывает на то, что его содержание имеет большое значение, серьёзность или срочность. Браузеры обычно отображают содержимое жирным шрифтом.</span></p>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row"><a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">Категории контента</a></th>
   <td><a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">Потоковой контент</a>, <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">Фразовый контент</a>, явный контент.</td>
  </tr>
  <tr>
   <th scope="row">Разрешённый контент</th>
   <td><a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">Фразовый контент</a>.</td>
  </tr>
  <tr>
   <th scope="row">Опускание тегов</th>
   <td>Нет, должен иметь как начальный тег, так и конечный тег.</td>
  </tr>
  <tr>
   <th scope="row">Разрешённые родители</th>
   <td>Любой элемент, который принимает <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">фразовый контент</a>, или любой другой элемент, который принимает <a href="https://developer.mozilla.org/ru/docs/Web/Guide/HTML/Content_categories">потоковой контент</a>.</td>
  </tr>
  <tr>
   <th scope="row">Разрешённые ARIA-роли</th>
   <td>Любые</td>
  </tr>
  <tr>
   <th scope="row">DOM-интерфейс</th>
   <td>{{domxref("HTMLElement")}}</td>
  </tr>
 </tbody>
</table>

<h2 id="Атрибуты">Атрибуты</h2>

<p>Этот элемент включает в себя <a href="https://developer.mozilla.org/ru/docs/Web/HTML/%D0%9E%D0%B1%D1%89%D0%B8%D0%B5_%D0%B0%D1%82%D1%80%D0%B8%D0%B1%D1%83%D1%82%D1%8B">глобальные атрибуты</a>.</p>

<h2 id="Замечания_по_использованию">Замечания по использованию</h2>

<p>Элемент <code>&lt;strong&gt;</code> предназначен для контента, который имеет "большое значение", включая вещи большой серьёзности или срочности (например, предупреждения). Это может быть предложение, которое имеет большое значение для всей страницы, или вы можете просто попытаться указать, что некоторые слова имеют большее значение по сравнению с соседним контентом.</p>

<p>Обычно этот элемент отображается по умолчанию с использованием жирного шрифта. Однако, он не должен быть использован просто для применения жирного стиля; используйте свойство CSS {{cssxref("font-weight")}} для этой цели. Используйте элемент {{HTMLElement("b")}}, чтобы привлечь внимание к определённому тексту без указания более высокого уровня важности. Используйте элемент {{HTMLElement("em")}} element для выделения текста, который имеет выраженный акцент.</p>

<p>Другим приемлемым использованием для <code>&lt;strong&gt;</code> является обозначение ярлыков абзацев, которые представляют заметки или предупреждения в тексте страницы.</p>

<h3 id="&lt;b>_против_&lt;strong>">&lt;b&gt; против &lt;strong&gt;</h3>

<p>Это часто путает новых разработчиков, почему существует так много способов выразить одно и то же на представленном веб-сайте. {{HTMLElement("b")}} и <code>&lt;strong&gt;</code> возможно, является одним из наиболее распространённых источников путаницы, заставляя разработчиков задавать себе вопрос: «Должен ли я использовать <code>&lt;b&gt;</code> или <code>&lt;strong&gt;</code>? Разве они не делают одно и тоже?»</p>

<p>Не совсем. Элемент <code>&lt;strong&gt;</code> для контента, который имеет большее значение, в то время как элемент <code>&lt;b&gt;</code> используется для привлечения внимания к тексту, не указывая на то, что это более важно.</p>

<p>Это может помочь понять, что оба являются правильным и семантическими элементами в HTML5, и это совпадение, что оба они имеют одинаковый стиль (полужирный) в большинстве браузеров (хотя некоторые старые браузеры фактически подчёркивают <code>&lt;strong&gt;</code>). Каждый элемент предназначен для использования в определённых типах сценариев, и если вы хотите жирный шрифт просто для украшения, вместо этого вы должные использовать свойства CSS {{cssxref("font-weight")}}.</p>

<p>Предполагаемое значение или цель прилагаемого текста должно быть тем, что определяет, какой элемент вы используете. Значение общения - вот что такое семантика.</p>

<h3 id="&lt;em>_против_&lt;strong>">&lt;em&gt; против &lt;strong&gt;</h3>

<p>Добавление к путанице заключается в том, что, хотя HTML 4 определяет <code>&lt;strong&gt;</code> как просто указывающий на более сильный акцент, HTML 5 определяет <code>&lt;strong&gt;</code> как представляющий "большое значение для его содержимого". Это важное различие.</p>

<p>В то время, как  <code>&lt;em&gt;</code> используется для изменения значения предложения, поскольку делается устный акцент ("Я <em>люблю</em> морковь" против "Я люблю<em>морковь</em>"), <code>&lt;strong&gt;</code> используется, для придания предложению порции особого значения (например, "<strong>Предупреждение!</strong> Это <strong>очень опасно.</strong>") Оба элемента <code>&lt;strong&gt;</code> и <code>&lt;em&gt;</code> могут быть вложены для увеличения относительной степени важности или усиленного акцента, соответственно.</p>

<h2 id="Примеры">Примеры</h2>

<h3 id="Основной_пример">Основной пример</h3>

<pre class="brush: html notranslate">&lt;p&gt;Прежде чем продолжить, &lt;strong&gt;убедитесь, что вы надели защитные очки&lt;/strong&gt;.&lt;/p&gt;</pre>

<p>Результат:</p>

<p>{{EmbedLiveSample("Основной_пример", 650, 80)}}</p>

<h3 id="Маркировочные_предупреждения">Маркировочные предупреждения</h3>

<pre class="brush: html notranslate">&lt;p&gt;&lt;strong&gt;Важно:&lt;/strong&gt; прежде чем продолжить, убедитесь, что вы добавили много масла.&lt;/p&gt;</pre>

<p>Это приведёт к:</p>

<p>{{EmbedLiveSample("Маркировочные_предупреждения", 650, 80)}}</p>

<h2 id="Спецификации">Спецификации</h2>

{{Specifications}}

<h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2>

<p>{{Compat("html.elements.strong")}}</p>

<h2 id="Смотрите_также">Смотрите также</h2>

<ul>
 <li>Элемент {{HTMLElement("b")}}</li>
 <li>Элемент {{HTMLElement("em")}}</li>
 <li>Элемент {{cssxref("font-weight")}}</li>
</ul>

<div>{{HTMLRef}}</div>