как изменить размер экрана мобильного телефона, чтобы он подходил под мой контент - PullRequest
1 голос
/ 24 февраля 2012

У меня проблемы с Adobe Device Central CS3.Я провожу тестирование мобильного веб-сайта только с использованием Html и CSS. Я занимаюсь его тестированием через центральное устройство, используя все телефоны Nokia в библиотеке.

Я выполнил макет в Ps, используя Nokia N80, что составляет 352 на 416 пикселей(мой документ в фотошопе)

В свои метатеги я добавляю следующий код:

<meta name="viewport" content="width=device-width" />
<!--The iPhone will auto fit the screen -->
<meta name="viewport" content="width=240, height=320, user-scalable=yes, initial-scale=0.7, maximum-scale=5.0, minimum-scale=1.0" />
<!--  adjusting Web pages to screens and adjusting Web page content size -->
<meta name="apple-mobile-web-app-capable" content="yes" /> 

<script type="text/javascript">
if((navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('iPod') != -1))
document.location = "http://iphone.mywebsite.com/index.html";

Когда я просматриваю на устройствах менее 352px на 416px, контент получаетнарезать и вы должны прокрутить в сторону.Из блогов, которые я читал, добавление «окна просмотра» должно решить проблему и сделать контент / сайт масштабируемым в соответствии с используемым устройством.

Я также должен отметить, что у меня есть div-оболочка, которая содержитвсе и имеет фиксированную ширину и высоту.

#wrapper {
width:352px;
height:416px;
background:url(../images/Site-Bg_02.png) repeat; 

}

Помогите!

1 Ответ

1 голос
/ 28 февраля 2012

Вы можете установить ширину окна просмотра на 352, но я НАСТОЯТЕЛЬНО рекомендую вместо этого проектировать страницу с гибкостью, то есть не использовать абсолютные значения в пикселях. Вместо этого используйте ширину в процентах и ​​попробуйте изменить размер вашего браузера (если у вас нет доступа к реальным устройствам для тестирования), чтобы убедиться, что ваши элементы соответствуют разным размерам.

Тег видового экрана будет работать только на определенных устройствах, а размер фиксированного пикселя - это, как правило, мобильный веб-номер.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...