vault backup: 2026-06-07 18:13:09

2026-06-07 18:13:09 +03:00
parent 89fb4f5f08
commit 67fbf5bbdb
1 changed files with 13 additions and 0 deletions
@@ -24,6 +24,7 @@ aliases:
 2) **Мобильная** - сайт создается на выделенном поддомене и адаптируется только под мобильные устройства. Соответственно, ресурс станет *удобен для чтения лишь пользователям смартфонов и планшетов.*
 3) **Резиновая** - ширина блока задается в процентах от ширины экрана пользователя. Благодаря этому "резиновые" сайты одинаково хорошо читаются с любых устройств. Тем не менее, адаптивная верстка, равно как и отзывчивая, постепенно вытесняет резиновую.
 4) **Отзывчивая** - напоминает адаптивную верстку, но в то же время принципиально отличается от нее. Отличие заключается в действиях на брейк-поинтах. Если в адаптивном варианте браузер резко меняет сверстанный макет, то в отзывчивом происходит плавное изменение верстки между точками слома с максимальным сохранением стабильного вида страницы. Фактически данный подход сочетает в себе признаки адаптивности и "резиновости".
+5) **Адаптивная** - Основные параметры сайта подстраиваются под характеристики пользовательского устройства. Ресурс в результате должен удобно читаться практически с любого гаджета или компьютера.

 Адаптивность (AWD) и отзывчивость (RWD) позволяют сайту корректно отображаться на любых устройствах.

@@ -37,6 +38,18 @@ aliases:
 - **Mobile First:** Сначала стили для мобильных, затем `min-width`.
 - **Desktop First:** Сначала для десктопов, затем `max-width`.

+```css 
+/* Различается и ориентация макета */
+@media (orientation: landscape) {
+	/* При горизонтальной ориентации фоновым цветом сайта будет белый */
+	body {
+		background: #FFF;
+	}
+}
+/* Ещё существует portrait - вертикальная */
+
+```
+
 ---

 # Flexbox (Flexible Box Layout)