Медиа-запросы (отзывчивый дизайн)

-4

Я новичок в кодировании, и у меня возникают проблемы с запросами CSS Media. Я заметил, что есть тонны размеров мобильных экранов, и есть ли способ, которым я могу настраивать их по группам без необходимости кодирования для каждого размера экрана для каждой модели компании - например, iPhone, Samsung и т. Д. Кроме того, даже если я нацелен на один мобильный дизайн, скажем, iPhone, мне нужно кодировать каждый размер экрана, iPhone 4, 5, 6? В Teamtreehouse они подчеркивают, что медиа-запросы не должны быть специфическими для мобильного экрана, но я этого не понимаю. Надеюсь, мои вопросы ясны.Медиа-запросы (отзывчивый дизайн)

источник

2015-11-16 Chris

Как вы в настоящее время кодирования размеры вашего сайта DIV-х годов? – user3216887

Это не что-то для стека, попробуйте quora. – James111

@ user3216887, я думаю, что моя задача не в размерах div, а в контрольных точках. Я пытался читать и читать решения в Интернете, но я, кажется, скрываю стену. Моя задача в частности заключается в том, как настроить отзывчивый дизайн без необходимости кодирования для каждого размера экрана, например, есть ли среднее значение, которое можно задать для всех размеров экранов в запросе на медиа. @ James111, почему я должен попробовать Quora? У меня есть учетная запись Quora, но я подумал, что я получу более конкретный ответ после оценки этих двух. – Chris

Запросы CSS Media позволяют настраивать правила CSS на основе размера экрана, ориентации устройства или разрешения устройства и т. Д. Обычно разработчики используют 4 общих точки прерывания (крошечные, узкие, средние и широкие) запросов CSS Media для целевых устройств на основе по разрешению. Ниже приведены общие запросы СМИ:

@media only screen and (min-width:1280px) {} 
@media (min-width:1024px) and (max-width:1279px) {} 
@media (min-width:768px) and (max-width:1023px) {} 
@media (min-width:480px) and (max-width:767px) {}

Примечание. При выполнении приведенных выше запросов CSS Media необходимо использовать мобильный первый подход.

Помимо выше ниже, могут быть использованы для нацеливания конкретного устройства, разрешение или ориентация:

https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

источник

2015-11-16 06:10:59

Спасибо за это! – Chris

Медиа-запросы (отзывчивый дизайн)

ответ

Смежные вопросы