1
Я работаю над отзывчивым дизайном. Чтобы остановить контент от пересекающихся границ, я использовал метка точки обзора с шириной = 480. Проблема в том, что я хочу, чтобы мой сайт загружал минимум 480px, несмотря ни на что. Если ширина экрана меньше 480 пикселей, я хочу, чтобы он соответствовал ширине экрана с помощью функции «Масштабирование».Исправлена ширина веб-страницы для мобильных устройств
Я использовал следующие точки обзора мета-тег:
<meta name="viewport" content="width=480px, initial-scale=1, maximum-scale=1" />
Я также использовал мин-ширина CSS метки, чтобы указать минимальную ширину.
<body style="min-width: 480px; width:100%; margin:auto;">
Итак, после всего этого, когда я пытался загрузить веб-сайт в Devtools Emulator (Google Chrome), она показывает горизонтальную полосу прокрутки. Есть идеи о том, как это сделать.
Спасибо за ваш ответ. Я попытался использовать whdth = device-width. Но дело в том, что он устанавливает ширину, равную ширине устройства. если ширина мобильного представления сайта меньше 480 пикселей, содержимое страницы становится испорченным. Поэтому я хочу, чтобы он перераспределял минимальную ширину до 480 пикселей. – Chaitanya
Можете ли вы использовать медиа-запросы для целевых устройств с шириной <480 пикселей? Пример: [статья о медиа-запросах] (http://css-tricks.com/css-media-queries/) –
Кроме того, не зная точно, какое мобильное приложение или устройство вы разрабатываете, считайте, что ваш код требуют, чтобы устройство соответствовало ** ТОЧНО ** определенная ширина, как правило, плохая идея. Причина в том, что тонны устройств не будут попадать в это точное измерение. Обычно лучше использовать диапазоны размеров устройства для выделения дизайна. –