• 0
Oloref

Помогите с адаптивной сеткой

Вопрос

Всем привет! Расскажите пожалуйста про адаптивную сетку. Просто для меня сетка - это обязательно 12 колонок и т.д. Но а если контент расположен не по сетки или начиная с промежуточных колонок или в каждой секции по разному расположен контент. Откройте мне пожалуйста всю истину адаптивных сеток, а то не понимаю. Или может использовать сетку только тогда, когда она есть в макете?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Рекомендованные сообщения

  • 0

Так я то вот и не понимаю, что такое сетка. Объясните пожалуйста.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
  • 0

представим что сетка сайта имеет левую структуру, при определенных условиях она превращается в правую - это и есть адаптация
0_b76aa_9ba7d36f_L

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

  • Похожие публикации

    • Автор: cutuz
      Здравствуйте, столкнулся с проблемой начального масштабирования на мобильных устройствах. Сайт без адаптации (по задумке заказчика), имеет ограниченную ширину width: 1024px !important; 
      На экранах любого размера сайт при загрузке должен открываться полностью весь, но на устройствах с шириной дисплея меньше 1200px при открывании сайта масштабируется. И приходиться отдалять. Помогите исправить данную проблему. 
      <html> <head> <title>Epic Birds</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta name="viewport" content="width=device-width, initial-scale=1"/> <link rel="stylesheet" href="css/main.css"/> </head> .limit{ width: 1024px !important; margin-left: auto; margin-right: auto; }  

    • Автор: maxfloyd
      Здравствуйте. padding подгоняется не четко, при изменении масштаба видно изъяны (подсветка кнопки не на всю высоту или на оборот больше чем нужно)

      Код: https://jsfiddle.net/aemjkhp9/
Learn HTML in 2 hours!


  • Спрашивают сейчас

  • Пишут сейчас

    • Дорогие Друзья! Рад вам сообщить о выходе новой версии движка Flextype и обновленном плагине Admin (Flextype 0.7.3 + Admin 0.3.0) 🚀 Это серьезное обновление для Flextype! Множество новых возможностей и фиксов улучшающие стабильность и производительность системы!  За эти 19 дней было потрачено более 100 часов на разработку и тестирование, запушено более 300 коммитов в репозитории проекта 👽 Изменения в Flextype 0.7.3: 
      - Flextype Компонент I18n обновлен до 1.2.0
      - Flextype Компонент Filesystem обновлен до 1.1.3
      - Symfony YAML Компонент обновлен до 4.2.1
      - Настройки теперь хранятся в одном settings.yaml файле
      - Content: добавлена возможность создавать скрытые страницы. Изменения в Admin 0.3.0:
      - Новая красивая админка в темном стиле! 
      (светлая тема будет в след. релизах)
      - Information: Страница информации отображает версию ядра и версию плагина админки
      - Users: теперь будут создаваться более безопасные пароли используя php функции password_hash и password_verify
      - Files manager: заменен на новый Media manager.
      - Pages Manager: улучшен функционал клонирования страниц. Теперь клонируется вся папка со страницей.
      - Pages Manager: исправлена бага с переименованием страниц #26 
      - Pages Manager: поле ссылки удалено из таблицы с страницами
      - Pages Manager: в быстрые экшена добавлена возможность просмотра страниц, ссылка открывает страницу в новом окне браузера.
      - Pages Manager: улучшено отображение вложенных страниц! теперь более наглядно отображаются вложенные страницы.
      - Pages Manager: исправлена бага с ссылкой на страницу по умолчанию, которая далее ломала логику работы с клонированными странницами.
      - Pages Manager: исправлена бага с пустым полем template
      - Pages Manager: добавлена возможность выбирать тему страниц при ее создании.
      - Pages Manager: много улучшений и исправлений в функционале по работе с страницами.
      - Pages Manager: Новый редактор страниц, редактор схемы (индивидуальные поля), редактор шаблона, редактор исходника страницы!
      - Plugins Manager: для плагина админки выключатель отключен, но отображается.
      - General: используется новые I18n 1.2.0 компонент.
      - General: используется новые Filesystem 1.1.3 компонент.
      - General: добавлена библиотека Gajus Dindent HTML для форматирование HTML кода, это позволяет сохранять красивый HTML после редактора!
      - General: добавлен Assets Manager для Javascript 
      - General: добавлен Animate.css для анимаций.
      - General: Fontawesome обновлен до 5.6.0 
      - General: Twitter Bootstrap обновлен до 4.1.3
      - General: Codemirror добавлен для лучшей работы с кодом.
      - General: es6-promise обновлен до 4.2.5
      - General: popper.js обновлен до 1.14.6
      - General: gulp-autoprefixer обновлен до 6.0.0
      - General: добавлена система отображения оповещений #41 
      - General: добавлена валидация форм jquery.form-validator.js
      - General: добавлено форматирование YAML файлов при их сохранении.
      - General: много общих улучшений архитектуры и скорости!
      - General: обновленная и улучшенная навигация!
      - Translates: много исправлений и улучшений в переводах. 
      Спасибо: Hmelex, AndiLeni, diomed Скачать Flextype 0.7.3
      https://github.com/flextype/flextype/releases/download/v0.7.3/flextype-0.7.3.zip Скачать Flextype 0.7.3 + Admin 0.3.0
      https://github.com/flextype/flextype/releases/download/v0.7.3/flextype-0.7.3-admin-0.3.0.zip Если у вас есть предложения по улучшению Админки и Ядра системы, пишите в комментариях и на официальном DISCORD сервере: https://discord.gg/tjEHXWD  
    • Большое спасибо за помощь, добавил с помощью теней по бокам  белые отступы и все получилось как в примере.
  • Лучшие авторы

  • Текущие цели пожертвований