Адаптивная вёрстка, min-width или max-width?

@litbit · Регистрация: 14.03.2013

Author24 — интернет-сервис помощи студентам

В bootstrap 3 применяется сетка на основе media queries, а именно @media (min-width), НО!!!!!!

Заметил, что в шаблонах, в которых применяют bootstrap для определения стилей в зависимости от разрешения экрана применяют не @media (min-width), а @media (max-width).

Возникает вопрос: почему bootstrap применяет @media (min-width), а в шаблонах применяют @media (max-width), а не тот же @media (min-width)?
И обратный вопрос, почему в bootstrap применяют @media (min-width), а не @media (max-width)?
Не понятна техника почему в сетке применяют @media (min-width), а в шаблоне применяющем эту сетку применяют @media (max-width)

Добавлено через 11 часов 50 минут
Нет ценителей тонкости верстки и профессионального подхода к мелочам?

@monochromer · 27.10.2014, 08:56

boostrap применяет подход, называемый "mobile first". То есть сначала стили пишутся для мобильных устройств, затем с помощью запросов @media (min-width) переходят к более широким экранам.

Почему используют @media (max-width)? Мне, например, так удобнее разрабатывать. Да и для старых IE в таком случае могут не понадобится костыли вроде respond.js.

@maximus2011 · 27.10.2014, 08:59

а почему бы просто не использовать медиа запросы? без bootstrap

@litbit · 28.10.2014, 20:27 **[ТС]**

Сообщение от maximus2011

а почему бы просто не использовать медиа запросы? без bootstrap

а какой смысл? Ведь я использую не весь бутстрап, а только его сетку.

Добавлено через 3 минуты

Сообщение от monochromer

Почему используют @media (max-width)?

Сообщение от monochromer

boostrap применяет подход, называемый "mobile first"

а какой сеткой вы пользуетесь? Имеет ли значение если в сетке применяется @media (min-width), а разработчик для стилизации применяет @media (max-width)? Или предпочтительнее использовать один тип, и для сетки @media (min-width) и для стилизации @media (min-width) или и для сетки @media (max-width) и для стилизации @media (max-width)?

@maximus2011 · 28.10.2014, 20:50

так а причем тут бутстрап и медиа запросы??? Почему все так помешаны на бутстрапе????

max-width и min-width используются как обычные стили. Поймите, бутстрап это не панацея. Вот вам пример, весь сайт на медиа запросах делается, подключен бутстрап, но исключительно для отдельных элементов http://carsharing.mgrwin.com/

@litbit · 28.10.2014, 21:42 **[ТС]**

Сообщение от maximus2011

так а причем тут бутстрап и медиа запросы??? Почему все так помешаны на бутстрапе????

я не помешан на нем, напротив, я против полного бутстрапа, а использую всего лишь его сетку для адаптивности, чтобы не изобретать "подобие велосипеда"

Новые блоги и статьи Все статьи Все блоги /
Неблокируемый стек в C++26: реализуем простой сборщик мусора stackOverflow 02.03.2025 Многопоточные приложения требуют надежных и производительных структур данных, способных эффективно работать в условиях конкурентного доступа. Неблокируемые структуры данных представляют собой особый. . .	Шаблон REQ/REP в ZeroMQ: сверхбыстрый обмен сообщениями в C++ и Python stackOverflow 02.03.2025 Построение высоконагруженных распределенных систем требует надежного и производительного механизма обмена сообщениями. ZeroMQ выделяется среди прочих решений своей невероятной скоростью работы и. . .	Нестандартные приемы работы с итераторами в C++ stackOverflow 02.03.2025 Итераторы - один из краеугольных камней C++, предоставляющий универсальный механизм обхода и манипуляции данными в контейнерах. Появившись как замена небезопасным указателям, они эволюционировали от. . .	Лексический анализ и регулярные выражения в C++26 stackOverflow 02.03.2025 Лексический анализ - ядро любого компилятора и инструмента обработки текста. Каждый программист сталкивается с задачами парсинга строк, обработки файлов конфигурации или анализа пользовательского. . .	Подробно о std::mdspan в C++23 stackOverflow 02.03.2025 Работа с многомерными массивами данных традиционно была одной из сложных задач в C++. Программистам приходилось создавать собственные абстракции или использовать сторонние библиотеки для эффективной. . .
Колмогоровская сложность в C++: Путь к совершенному коду stackOverflow 02.03.2025 Абстрактная математическая теория Колмогорова стала мощным средством оценки и улучшения программного кода. Сложность алгоритма - не только в его вычислительной эффективности, но и в том, насколько. . .	Изменения в C# 14 stackOverflow 02.03.2025 Одно из самых значимых изменений в C# 14 - поддержка коллекционных выражений, которые позволяют создавать и инициализировать коллекции с помощью нового лаконичного синтаксиса. Это нововведение. . .	Разработка кроссплатформенного мобильного приложения для iOS/Android на C++ bytestream 02.03.2025 C++ как язык программирования высокого уровня с прямым доступом к аппаратным ресурсам позволяет создавать приложения, работающие одинаково быстро как на iOS, так и на Android устройствах. Ни для кого. . .	Аутентификация/авторизация на Golang bytestream 02.03.2025 Go предлагает множество возможностей для создания надежных систем аутентификации. Встроенные криптографические пакеты, высокая производительность и простота параллельной обработки запросов делают его. . .	Нововведения TypeScript 5.8 bytestream 02.03.2025 TypeScript 5. 8 приносит много возможностей и оптимизаций, которые существенно расширяют границы типобезопасного программирования на JavaScript. Эта версия включает ряд значительных улучшений в работе. . .

@litbit 0 / 0 / 1 Регистрация: 14.03.2013 Сообщений: 150
		1
	Адаптивная вёрстка, min-width или max-width? 27.10.2014, 08:05. Показов 5368. Ответов 5 Метки нет (Все метки) В bootstrap 3 применяется сетка на основе media queries, а именно @media (min-width), НО!!!!!! Заметил, что в шаблонах, в которых применяют bootstrap для определения стилей в зависимости от разрешения экрана применяют не @media (min-width), а @media (max-width). Возникает вопрос: почему bootstrap применяет @media (min-width), а в шаблонах применяют @media (max-width), а не тот же @media (min-width)? И обратный вопрос, почему в bootstrap применяют @media (min-width), а не @media (max-width)? Не понятна техника почему в сетке применяют @media (min-width), а в шаблоне применяющем эту сетку применяют @media (max-width) Добавлено через 11 часов 50 минут Нет ценителей тонкости верстки и профессионального подхода к мелочам? 0

@monochromer 419 / 381 / 163 Регистрация: 03.01.2013 Сообщений: 966
	27.10.2014, 08:56	2
	boostrap применяет подход, называемый "mobile first". То есть сначала стили пишутся для мобильных устройств, затем с помощью запросов @media (min-width) переходят к более широким экранам. Почему используют @media (max-width)? Мне, например, так удобнее разрабатывать. Да и для старых IE в таком случае могут не понадобится костыли вроде respond.js. 0

@maximus2011 269 / 261 / 35 Регистрация: 21.02.2012 Сообщений: 1,078
	27.10.2014, 08:59	3
	а почему бы просто не использовать медиа запросы? без bootstrap 0

@litbit 0 / 0 / 1 Регистрация: 14.03.2013 Сообщений: 150
	28.10.2014, 20:27 [ТС]	4
	Сообщение от maximus2011 а почему бы просто не использовать медиа запросы? без bootstrap а какой смысл? Ведь я использую не весь бутстрап, а только его сетку. Добавлено через 3 минуты Сообщение от monochromer Почему используют @media (max-width)? Сообщение от monochromer boostrap применяет подход, называемый "mobile first" а какой сеткой вы пользуетесь? Имеет ли значение если в сетке применяется @media (min-width), а разработчик для стилизации применяет @media (max-width)? Или предпочтительнее использовать один тип, и для сетки @media (min-width) и для стилизации @media (min-width) или и для сетки @media (max-width) и для стилизации @media (max-width)? 0

@maximus2011 269 / 261 / 35 Регистрация: 21.02.2012 Сообщений: 1,078
	28.10.2014, 20:50	5
	так а причем тут бутстрап и медиа запросы??? Почему все так помешаны на бутстрапе???? max-width и min-width используются как обычные стили. Поймите, бутстрап это не панацея. Вот вам пример, весь сайт на медиа запросах делается, подключен бутстрап, но исключительно для отдельных элементов http://carsharing.mgrwin.com/ 0

@litbit 0 / 0 / 1 Регистрация: 14.03.2013 Сообщений: 150
	28.10.2014, 21:42 [ТС]	6
	Сообщение от maximus2011 так а причем тут бутстрап и медиа запросы??? Почему все так помешаны на бутстрапе???? я не помешан на нем, напротив, я против полного бутстрапа, а использую всего лишь его сетку для адаптивности, чтобы не изобретать "подобие велосипеда" 0