Мне нужно собрать веб-сайт для мобильных устройств, поэтому iPhone и различные андроиды. Проблема в том, что я борюсь с получением права на просмотр и другие настройки. Моя цель состоит в том, чтобы веб-страница была закодирована для определенной ширины, например. 640px в ширину. Затем, когда открытое устройство будет увеличивать/уменьшать масштаб до ширины экрана, все становится больше или меньше того же, что и после вставки/выключения изображения с помощью зажима на экране устройства.Как сделать мобильную страницу подходящей на экране после открытия?
Итак, я хотел бы разработать его для того, чтобы позволить говорить ширину 640 пикселей и в зависимости от устройства он будет масштабироваться вверх или вниз после открытия. Поэтому, если экран устройства будет иметь ширину 960 пикселей, он будет автоматически масштабироваться до этой ширины с помощью видового экрана. Возможно ли вообще, чтобы оно было закодировано для предопределенной ширины в css и увеличилось/уменьшилось по мере необходимости самим устройством?
Приносим извинения, если вопрос является слишком общим, объяснит детали при необходимости.
EDIT: Таким образом, наиболее распространенный подход, если я правильно понимаю, состоит в том, чтобы предоставить несколько версий макета для большинства размеров экрана сообщества? Использование медиа-запросов в css предоставляет разные значения для ширины, размеры шрифтов и т. Д., Так?
Если я решаю, однако, идти с процентами, а не с медиа-запросами, учитывая предоставленный дизайн. Я думаю, что все еще будет проблема с изменением размера шрифтов, поскольку в макете есть изображения с текстом в нем, а текст должен быть пропорционален изображению. Также проценты будут заботиться о ширинах, высота может быть проблемой, хотя, поскольку изображения должны быть изменены также вертикально. Некоторым частям дизайна нужно «подогнать» друг друга, и это станет проблемой, я думаю.
Теперь, если я просто создаю веб-сайт определенной ширины, скажем, 640px, я могу разместить все на экране с пикселями, без каких-либо различий с обычным немобильным сайтом.
Итак, я попытался установить <meta name="viewport" content="width=640"> и внутри ширины страницы ширины самого широкого контейнера в css до 640px, делая ширину страницы в 640px в основном. Если я правильно понимаю, он установит окно просмотра в точную ширину страницы. Таким образом, страница будет построена как любая другая немобильная веб-страница. Потребуется настроить масштаб, зажав его, как при открытии страницы, по какой-то причине, как правило, увеличивается/уменьшаться. Мое понимание того, что здесь происходит, правильное или есть какая-то проблема с ним. Имея предопределенный размер, он заботится о разных размерах экрана мобильного телефона, так как окно просмотра всегда одинаково, вписывается в ширину страницы, и только масштаб кажется проблемой, то есть, если я здесь что-то не хватает.
Я также должен был упомянуть, что мне нужно сделать только портрет и сделать его единственным вариантом, поэтому нет пейзажного вида (это будет другой вопрос).
Хотел бы узнать ваши мысли, и я ценю все ответы до сих пор.
вы знаете о CSS3 Media Queries вы можете добиться желаемого результата с помощью этой опции .... –
, но тогда бы не я создать отдельный css с шириной и т. д. для разных устройств? Я хотел бы избежать этого, если возможно – spirytus
Нет, без этого вам не придется использовать CSS3 Media Queries, если вы хотите отображать свой сайт в соответствии с различными мобильными устройствами ..... –