initial commit

1 files changed, 104 insertions, 0 deletions

diff --git a/files/ru/web/css/block-size/index.html b/files/ru/web/css/block-size/index.html
new file mode 100644
index 0000000000..413705bb6d
--- /dev/null
+++ b/files/ru/web/css/block-size/index.html
@@ -0,0 +1,104 @@
+---
+title: block-size
+slug: Web/CSS/block-size
+tags:
+  - CSS
+  - CSS Logical Property
+  - CSS Property
+  - Experimental
+  - Reference
+  - Справка
+  - Экспериментальный
+translation_of: Web/CSS/block-size
+---
+<div>{{CSSRef}}{{SeeCompatTable}}</div>
+
+<p>Свойство <strong><code>block-size</code></strong> <a href="/ru/docs/Web/CSS" title="CSS">CSS</a> задает горизонтальный и вертикальный размер блока элемента, в зависимости от режима его записи (writing mode). Оно соответствует свойствам {{cssxref("width")}} и {{cssxref("height")}} и зависит от значения свойства {{cssxref("writing-mode")}}.</p>
+
+<pre class="brush:css no-line-numbers">/* &lt;length&gt; values */
+block-size: 300px;
+block-size: 25em;
+
+/* &lt;percentage&gt; values */
+block-size: 75%;
+
+/* Keyword values */
+block-size: 25em border-box;
+block-size: 75% content-box;
+block-size: max-content;
+block-size: min-content;
+block-size: available;
+block-size: fit-content;
+block-size: auto;
+
+/* Global values */
+block-size: inherit;
+block-size: initial;
+block-size: unset;
+</pre>
+
+<p>Если режим записи (writing mode) ориентирован по вертикали, то значение <code> block-size  относится к ширине элемента; в противном случае это относится к высоте элемента. С данным свойством связано свойство {{cssxref("inline-size")}}, которое задает другое измерение элемента.</code></p>
+
+<p><code>{{cssinfo}}</code></p>
+
+<h2 id="Синтаксис"><code>Синтаксис</code></h2>
+
+<h3 id="Значения"><code>Значения</code></h3>
+
+<p><code>Свойство <code>block-size</code> принимает те же значения, что и свойства {{cssxref("width")}}, {{cssxref("height")}} </code></p>
+
+<h3 id="Формальный_синтаксис"><code>Формальный синтаксис</code></h3>
+
+<pre class="syntaxbox"><code>
+{{csssyntax}}</code></pre>
+
+<h2 id="Пример"><code>Пример</code></h2>
+
+<h3 id="HTML"><code>HTML</code></h3>
+
+<pre class="brush: html"><code>
+&lt;p class="exampleText"&gt;Example text&lt;/p&gt;
+</code></pre>
+
+<h3 id="CSS"><code>CSS</code></h3>
+
+<pre class="brush: css"><code>
+.exampleText {
+  writing-mode: vertical-rl;
+  background-color: yellow;
+  block-size: 200px;
+}</code></pre>
+
+<p><code>{{EmbedLiveSample("Example")}}</code></p>
+
+<h2 id="Спецификация"><code>Спецификация</code></h2>
+
+<table class="standard-table">
+ <thead>
+  <tr>
+   <th scope="col"><code>Specification</code></th>
+   <th scope="col"><code>Status</code></th>
+   <th scope="col"><code>Comment</code></th>
+  </tr>
+ </thead>
+ <tbody>
+  <tr>
+   <td><code>{{SpecName("CSS Logical Properties", "#logical-dimension-properties", "block-size")}}</code></td>
+   <td><code>{{Spec2("CSS Logical Properties")}}</code></td>
+   <td><code>Initial definition</code></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Совместимость_с_браузерами"><code>Совместимость с браузерами</code></h2>
+
+<div class="hidden"><code>Таблица совместимости на этой странице создается на основе структурированных данных. Если вы хотите внести свой вклад в разработку, пожалуйста, проверьте <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> и отправьте нам соответствующий запрос.</code></div>
+
+<p><code>{{Compat("css.properties.block-size")}}</code></p>
+
+<h2 id="Смотри_также"><code>Смотри также</code></h2>
+
+<ul>
+ <li><code>Отображаемые физические свойства: {{cssxref("width")}} and {{cssxref("height")}}</code></li>
+ <li><code>{{cssxref("writing-mode")}}</code></li>
+</ul>