#html #css #web #media #device-compatibility
#HTML #css #паутина #Медиафайлы #совместимость с устройствами
Вопрос:
В настоящее время я использую @media only screen и (максимальная ширина: 1000 пикселей) {} для совместимого с устройством css для моего веб-сайта, который работал на телефонах после загрузки, но не на маленьком мониторе ПК (ширина около 1200 пикселей). Предположительно, он работал на моем домашнем компьютере, когда я отрегулировал ширину браузера. Правильна ли строка синтаксиса?
Комментарии:
1. Добро пожаловать в SO. Вы должны поделиться своим кодом с css, чтобы найти решение
2. Общие медиа-запросы для устройств можно найти здесь — см.
Ответ №1:
Эта строка отсутствовала в заголовке
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Наряду с этим был кеш браузера, который добавлял страданий моей CSS-жизни.
Ответ №2:
Ваш медиа-запрос может перекрываться. Попробуйте это ниже
@media screen (min-width: 800px) {
//your style here !
}
@media screen (min-width: 1200px) {
//your style here !
}
Комментарии:
1. Я пытался, но некоторые элементы мобильных версий меньшей ширины не смогли переопределить основной дизайн.