aboutsummaryrefslogtreecommitdiff
path: root/files/ru/web/css/layout_mode/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/ru/web/css/layout_mode/index.html')
-rw-r--r--files/ru/web/css/layout_mode/index.html28
1 files changed, 28 insertions, 0 deletions
diff --git a/files/ru/web/css/layout_mode/index.html b/files/ru/web/css/layout_mode/index.html
new file mode 100644
index 0000000000..dcf1440cb5
--- /dev/null
+++ b/files/ru/web/css/layout_mode/index.html
@@ -0,0 +1,28 @@
+---
+title: Способ разметки
+slug: Web/CSS/Способ_расположения
+tags:
+ - CSS
+translation_of: Web/CSS/Layout_mode
+---
+<p><a href="/ru/docs/CSS" title="/ru/docs/CSS">CSS</a> <strong>способ разметки </strong>(или <em>раскладки,</em> или англ. <em>layout</em>) — это алгоритм определения позиции и размеров блоков, основанный на способе, которым они взаимодействуют с родственными блоками. Существует несколько типов разметки:</p>
+
+<ul>
+ <li><em>Обычная</em> <em>(Normal Flow)</em> — все элементы являются частью обычного потока до тех пор, пока вы не переопределите это каким-либо образом. Обычный <em>layout </em>включает в себя <em>блочную раскладку</em>, созданную для расположения отдельных блоков, таких как параграфы, и <em>линейную,</em>—<em> </em>для строчных элементов;</li>
+ <li><em><a href="/ru/docs/Web/CSS/CSS_Table">Табличная</a></em>, спроектированная для расположения таблиц;</li>
+ <li><em>Float layout </em>— для возможности обозначить элементы <em><a href="/ru/docs/CSS/float" title="/ru/docs/CSS/float">плавающими</a>. </em>Такой<em> </em>элемент начинает позиционироваться слева или справа отностительно содержимого обычного потока, элементы которого начинают обтекать него;</li>
+ <li><em><a href="/ru/docs/Web/CSS/CSS_Positioning">Позиционированная</a> </em>— для позиционирования элементов без особого взаимодействия с другими элементами;</li>
+ <li><em><a href="/ru/docs/Web/CSS/CSS_Columns">Множественные столбцы</a></em> — для расположения контента колонками, как в газетах;</li>
+ <li><em><a href="/ru/docs/Web/CSS/CSS_Flexible_Box_Layout">Флексбокс</a> </em><em>(CSS Flexible Box Layout)</em> — для расположения сложных страниц, которые плавно могут изменять свой размер; {{ experimental_inline() }}</li>
+ <li><em><a href="/ru/docs/Web/CSS/CSS_Grid_Layout">Сеточная</a></em> — для расположения элементов относительно фиксированной сетки. {{ experimental_inline() }}</li>
+</ul>
+
+<div class="note">
+<p><strong>Примечание:</strong> не все <a href="/ru/docs/Web/CSS/Reference" title="/ru/docs/Web/CSS/Reference">CSS свойства</a> применимы ко всем способам разметки. Большинство из них применяются к одному или двум из них и не действуют, если применяются на элементе, участвующем в другом режиме разметки.</p>
+</div>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li>{{ CSS_key_concepts() }}</li>
+</ul>