initial commit

1 files changed, 316 insertions, 0 deletions

diff --git a/files/ru/web/css/font-weight/index.html b/files/ru/web/css/font-weight/index.html
new file mode 100644
index 0000000000..290ab85aca
--- /dev/null
+++ b/files/ru/web/css/font-weight/index.html
@@ -0,0 +1,316 @@
+---
+title: font-weight
+slug: Web/CSS/font-weight
+tags:
+  - CSS
+  - Свойства
+  - Справка
+  - Шрифты
+translation_of: Web/CSS/font-weight
+---
+<div>{{CSSRef}}</div>
+
+<p><a href="/ru/docs/Web/CSS" title="CSS">CSS</a> свойство <strong><code>font-weight</code></strong> устанавливает начертание шрифта. Некоторые шрифты доступны только в нормальном или полужирном начертании.</p>
+
+<div>{{EmbedInteractiveExample("pages/css/font-weight.html")}}</div>
+
+
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="brush:css">font-weight: normal;
+font-weight: bold;
+
+/* Relative to the parent */
+font-weight: lighter;
+font-weight: bolder;
+
+font-weight: 100;
+font-weight: 200;
+font-weight: 300;
+font-weight: 400;
+font-weight: 500;
+font-weight: 600;
+font-weight: 700;
+font-weight: 800;
+font-weight: 900;
+
+/* Global values */
+font-weight: inherit;
+font-weight: initial;
+font-weight: unset;
+</pre>
+
+<h3 id="Значения">Значения</h3>
+
+<dl>
+ <dt><code>normal</code></dt>
+ <dd>Нормальное начертание. То же, что и <code>400</code>.</dd>
+ <dt><code>bold</code></dt>
+ <dd>Полужирное начертание. То же, что и <code>700</code>.</dd>
+ <dt><code>lighter</code></dt>
+ <dd>Изменяет начертание относительно насыщенности родительского элемента (сверхтонкое начертание).</dd>
+ <dt><code>bolder</code></dt>
+ <dd>Изменяет начертание относительно насыщенности родителя элемента (сверхжирное начертание).</dd>
+ <dt><code>100</code>, <code>200</code>, <code>300</code>, <code>400</code>, <code>500</code>, <code>600</code>, <code>700</code>, <code>800</code>, <code>900</code></dt>
+ <dd>Цифровые значения насыщенности шрифтов, которые позволяют задавать больше, чем нормальное и полужирное начертание.</dd>
+</dl>
+
+<h3 id="Недоступность_заданного_значения">Недоступность заданного значения</h3>
+
+<p>Если заданное цифровое значение насыщенности недоступно, для определения толщины отображемого шрифта используется следующий алгоритм:</p>
+
+<ul>
+ <li>Если задано значение выше <code>500</code>, будет использовано первое доступное более жирное начертание (если такого не окажется, то первое доступное более светлое).</li>
+ <li>Если задано значение менее <code>400</code>, будет использовано первое доступное более светлое начертание (если такого не окажется, то первое доступное более жирное).</li>
+ <li>Если задано значение <code>400</code>, будет применено <code>500</code>. Если <code>500</code> недоступно, то будет использован алгоритм для подбора значений менее <code>400</code>.</li>
+ <li>Если задано значение <code>500</code>, будет применено <code>400</code>. Если <code>400</code> недоступно, то будет использован алгоритм для подбора значений менее <code>400</code>.</li>
+</ul>
+
+<p><span id="result_box" lang="ru"><span class="hps">Это означает, что</span> <span class="hps">для шрифтов</span><span>, которые предоставляют</span> <span class="hps">только</span> <span class="hps">normal и</span> bold<span class="hps"> начертания,</span> <span class="hps">100-500</span> <span class="hps">normal</span><span>,</span> <span class="hps">и</span> <span class="hps">600-900</span> bold<span class="hps">.</span></span></p>
+
+<h3 id="Значение_относительных_весов">Значение относительных весов</h3>
+
+<p>Когда используется <strong>жирнее </strong>или <strong>светлее</strong>, следующая таблица используется для вычисления абсолютного веса элемента:</p>
+
+<table>
+ <thead>
+  <tr>
+   <th>наследуемое значение</th>
+   <th><code>жирнее</code></th>
+   <th><code>светлее</code></th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <th>100</th>
+   <td>400</td>
+   <td>100</td>
+  </tr>
+  <tr>
+   <th>200</th>
+   <td>400</td>
+   <td>100</td>
+  </tr>
+  <tr>
+   <th>300</th>
+   <td>400</td>
+   <td>100</td>
+  </tr>
+  <tr>
+   <th>400</th>
+   <td>700</td>
+   <td>100</td>
+  </tr>
+  <tr>
+   <th>500</th>
+   <td>700</td>
+   <td>100</td>
+  </tr>
+  <tr>
+   <th>600</th>
+   <td>900</td>
+   <td>400</td>
+  </tr>
+  <tr>
+   <th>700</th>
+   <td>900</td>
+   <td>400</td>
+  </tr>
+  <tr>
+   <th>800</th>
+   <td>900</td>
+   <td>700</td>
+  </tr>
+  <tr>
+   <th>900</th>
+   <td>900</td>
+   <td>700</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Определение_веса_имени">Определение веса имени</h3>
+
+<p>Значения от 100 до 900, примерно, соответствуют следующим распространенным именам насыщенности:</p>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Значение</th>
+   <th scope="col">Общее название</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>100</code></td>
+   <td>Тонкий (Волосяной) Thin (Hairline)</td>
+  </tr>
+  <tr>
+   <td><code>200</code></td>
+   <td>Дополнительный светлый (Сверхсветлый) Extra Light (Ultra Light)</td>
+  </tr>
+  <tr>
+   <td><code>300</code></td>
+   <td>Светлый Light</td>
+  </tr>
+  <tr>
+   <td><code>400</code></td>
+   <td>Нормальный Normal</td>
+  </tr>
+  <tr>
+   <td><code>500</code></td>
+   <td>Средний Medium</td>
+  </tr>
+  <tr>
+   <td><code>600</code></td>
+   <td>Полужирный Semi Bold (Demi Bold)</td>
+  </tr>
+  <tr>
+   <td><code>700</code></td>
+   <td>Жирный Bold</td>
+  </tr>
+  <tr>
+   <td><code>800</code></td>
+   <td>Дополнительный жирный (Сверхжирный) Extra Bold (Ultra Bold)</td>
+  </tr>
+  <tr>
+   <td><code>900</code></td>
+   <td>Черный (Густой) Black (Heavy)</td>
+  </tr>
+ </tbody>
+</table>
+
+<h3 id="Интерполяция">Интерполяция</h3>
+
+<p>Значения <code>font-weight</code> интерполируются  с помощью дискретных шагов (кратные 100). <span id="result_box" lang="ru"><span class="hps">Интерполяция</span> <span class="hps">происходит в действительном пространстве чисел</span> <span class="hps">и превращается</span> <span class="hps">в целое число путем</span> <span class="hps">округления до</span> <span class="hps">ближайшего числа, кратного</span> <span class="hps">100,</span> <span class="hps">со значениями</span> <span class="alt-edited hps">посредине между</span> <span class="alt-edited hps">кратными 100</span> <span class="alt-edited hps">округленными</span> <span class="alt-edited hps">в сторону</span> <span class="hps">положительной бесконечности</span><span>.</span></span></p>
+
+<h3 id="Формальный_синтаксис">Формальный синтаксис</h3>
+
+<pre class="syntaxbox">{{csssyntax}}</pre>
+
+<h2 id="Примеры">Примеры</h2>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;p&gt;
+  Alice was beginning to get very tired of sitting by her sister on the
+  bank, and of having nothing to do: once or twice she had peeped into the
+  book her sister was reading, but it had no pictures or conversations in
+  it, 'and what is the use of a book,' thought Alice 'without pictures or
+  conversations?'
+&lt;/p&gt;
+
+&lt;div&gt;I'm heavy&lt;br/&gt;
+  &lt;span&gt;I'm lighter&lt;/span&gt;
+&lt;/div&gt;
+</pre>
+
+<h3 id="CSS">CSS</h3>
+
+<pre class="brush:css">/* Назначение тексту элемента &lt;<code>p&gt;</code> жирного начертания. */
+p {
+  font-weight: bold;
+}
+
+/* Назначение тексту элемента &lt;div&gt; жирности, которая больше на два уровня,
+чем normal, но все еще меньше, чем стандартный bold. */
+div {
+ font-weight: 600;
+}
+
+/* Назначение тексту элемента &lt;span&gt; жирности,
+которая на один уровень меньше, чем у его родителя. */
+span {
+  font-weight: lighter;
+}</pre>
+
+<h3 id="Result">Result</h3>
+
+<p>{{EmbedLiveSample("Примеры","400","300")}}</p>
+
+<h2 id="Спецификации">Спецификации</h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td>{{SpecName('CSS3 Fonts', '#font-weight-prop', 'font-weight')}}</td>
+   <td>{{Spec2('CSS3 Fonts')}}</td>
+   <td>No change</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS3 Transitions', '#animatable-css', 'font-weight')}}</td>
+   <td>{{Spec2('CSS3 Transitions')}}</td>
+   <td>Defines <code>font-weight</code> as animatable.</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS2.1', 'fonts.html#propdef-font-weight', 'font-weight')}}</td>
+   <td>{{Spec2('CSS2.1')}}</td>
+   <td>No change</td>
+  </tr>
+  <tr>
+   <td>{{SpecName('CSS1', '#font-weight', 'font-weight')}}</td>
+   <td>{{Spec2('CSS1')}}</td>
+   <td>Initial definition</td>
+  </tr>
+ </tbody>
+</table>
+
+<p>{{cssinfo}}</p>
+
+<h2 id="Совместимость_браузеров">Совместимость браузеров</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Chrome</th>
+   <th>Firefox (Gecko)</th>
+   <th>Internet Explorer</th>
+   <th>Opera</th>
+   <th>Safari (WebKit)</th>
+  </tr>
+  <tr>
+   <td>Базовая поддержка</td>
+   <td>2.0</td>
+   <td>{{CompatGeckoDesktop(1.0)}}</td>
+   <td>3.0</td>
+   <td>3.5</td>
+   <td>1.3</td>
+  </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+  <tr>
+   <th>Feature</th>
+   <th>Android</th>
+   <th>Firefox Mobile (Gecko)</th>
+   <th>IE Phone</th>
+   <th>Opera Mobile</th>
+   <th>Safari Mobile</th>
+  </tr>
+  <tr>
+   <td>Базовая поддержка</td>
+   <td>1.0</td>
+   <td>{{CompatGeckoMobile(1.0)}}</td>
+   <td>6.0</td>
+   <td>6.0</td>
+   <td>3.1</td>
+  </tr>
+ </tbody>
+</table>
+</div>