/* Устройства с очень маленьким экраном (смартфоны, меньше 768px) */
/* Стили CSS (по умолчанию) - для ширины viewport <768px */
/* Устроства с маленьким экраном (планшеты, 768px и выше) */
@media (min-width: 768px) {
/* Стили для устройств с шириной viewport, находящейся в диапазоне 768px - 991px */
}
/* Устройства со средним экраном (ноутбуки и компьютеры, 992px и выше) */
@media (min-width: 992px) {
/* Стили для устройств с шириной viewport, находящейся в диапазоне 992px - 1199px */
}
/* Устройства с большим экраном (компьютеры, 1200px и выше) */
@media (min-width: 1200px) {
/* Стили для устройств с шириной viewport >1200px */
}
=====Пример сайта=====
Пример сайта выполненного в [[https://book51.ru/demo/code/blender3d_demo.html|адаптивной вёрстке]] можно посмотреть в разделе пример или перейдя по [[https://book51.ru/demo/code/blender3d_demo.html|ссылке]]. для понимания примера необходимо сузить просматриваемую страницу в браузере или просмотреть на компьютере и в браузере мобильного устройства.
====1. Блок ====
Добавим в блок %%%% (голова) запись кода приведенного ниже и открыв **"Пояснительную записку блока :"** разберем данный код:
Responsive site layout
#: Пояснительная записка блока :
- **%%%%**
#:Пояснительную записку блока
Blender 3.6 LTS
Blender 3D program
Blender is one of the most popular 3D modeling software. This is a multifunctional software, acquaintance with which will be useful for those who are interested in 3d graphics and who want to understand the basic principles of this industry.
Spring
Is the story of a shepherdess and her dog who encounter ancient spirits in order to continue the cycle of life..
#:Пояснительная записка блока main:
- **%%%%** - начало блока хранения содержания веб-страницы (контента).
- **%%%%** - начало контейнера контента веб страницы.
- **%%%%** - начало контейнера с анонсом статей.
- **%%%%** - начало контейнера с анонсом 1й статьи.
- **%%
%%** - блок вставки картинки с указанием месторасположения файла.
- **%%%%** - начало блока текстовой информации 1й статьи.
- **%%%%** - блок указания категории 1й статьи.
- **%%Blender 3.6 LTS
%%** - блок заголовка 1й статьи.
- **%%%%**Blender 3D program Blender is one of the most popular 3D modeling software. This is a multifunctional software, acquaintance with which will be useful for those who are interested in 3d graphics and who want to understand the basic principles of this industry. - **%%
%%** - блок текста 1й статьи.
- **%%%%** - конец блока "Читать далее" 1й статьи.
- **%%%%** - конец блока текстовой информации 1й статьи.
- **%% %%** - конец контейнера с анонсом 1й статьи.
- **%%%%** - начало контейнера с анонсом 2й статьи.
- **%%%%** - конец блока вставки видеофайла с указанием месторасположения.
- **%%%%** - начало блока текстовой информации 2й статьи.
- **%%%%** - блок указания категории 2й статьи.
- **%%Spring
%%** - блок заголовка 2й статьи.
- **%%%%**Is the story of a shepherdess and her dog who encounter ancient spirits in order to continue the cycle of life.**%%
%%** - блок текста 2й статьи.
- **%%%%** - конец блока "Читать далее" 2й статьи.
- **%%%%** - конец блока текстовой информации 2й статьи.
- **%% %%** - конец контейнера с анонсом 2й статьи.
- **%%%%** - конец контейнера с анонсом статей.
:#
====4. Блок
#:«Пояснительная записка блока %%** - конец контейнера всего контента веб страницы.
:#
====5. Блок