как написать html-страничук, которая будет грамотно отображаться на смартфонах.
Мне необходимо создать простую страницу с текстом и окном чата, но сколько я не пытаюсь, на браузерах смартфонов на базе андроида у меня куча пустого места и в верхнем левом углу сайт в виде маленького вертикального окошка, если я пытаюсь ограничить размерами, или при умолчании или растягивании на 100% у меня все дико растянуто и все на странице невероятно мелко. Я заходил на многие сайты со своего смарта и видел, как они преображались для браузера андроида, отображаясь нормально точно под размер окна. Помогите понять как это делать, пожалуйста!
Делай просто резиновый сайт. Положение и размеры всех элементов указывай в процентах тогда он и будет грамотно развоачиваться. А вообще лучше использовать технологии HTML5 и CSS3 тогда точно всё будет гуд
Приветствую, теска =)
Это не помогает. Я уже... блин... все перепробовал. На смарте страница ведет себя по алгоритму: - "то понос, то золотуха". Я даже перепробовал все, что связано с мета тегом viewport, который предназначен как раз для смартовых браузеров. Них.............. (beep). Уже дошел до состояния почти полной готовности бития головой об стенку, где висит табличка "если ты лох, стучаться тут..." =(
Беда в том, что браузеры смартов воспринимают страницу по умолчанию как десктопную и растягивают, делая все мелко нечитаемым. Плюс ко всему я никак не могу понять, как отключить гр..(beep)..ное зуммирование при попытке набрать сообщение в поле ввода оного. Это какой-то КОШМАР просто. Мне таки кое как удалось при помощи этого viewport заставить браузер отображать более и менее нормально, но стоит набрать сообщение в чате на страничке, как все - все уползает, зуммируется, а если еще и поворот опробировать, то полный П. Как буд-то мета тега и нет в теле странички - все растягивается как при десктопном отображении.
Это не помогает. Я уже... блин... все перепробовал. На смарте страница ведет себя по алгоритму: - "то понос, то золотуха". Я даже перепробовал все, что связано с мета тегом viewport, который предназначен как раз для смартовых браузеров. Них.............. (beep). Уже дошел до состояния почти полной готовности бития головой об стенку, где висит табличка "если ты лох, стучаться тут..." =(
Беда в том, что браузеры смартов воспринимают страницу по умолчанию как десктопную и растягивают, делая все мелко нечитаемым. Плюс ко всему я никак не могу понять, как отключить гр..(beep)..ное зуммирование при попытке набрать сообщение в поле ввода оного. Это какой-то КОШМАР просто. Мне таки кое как удалось при помощи этого viewport заставить браузер отображать более и менее нормально, но стоит набрать сообщение в чате на страничке, как все - все уползает, зуммируется, а если еще и поворот опробировать, то полный П. Как буд-то мета тега и нет в теле странички - все растягивается как при десктопном отображении.
Что бы не изобретать велосепед скачай любой шаблон CSS3 и воткни в него чат или что тебе нужно.
1) Нужно объяснить смартфону, чтобы он автоматически не масштабировал страницу. Сделать это можно добавив в заголовок HTML следующий META-тег:
2) Нужно сверстать страницу так, чтобы она нормально показывалась при любой ширине окна (как минимум от 320 пикселей). Для этого можно использовать медиа-запросы:
С нуля начинать не так просто, по этому рекомендую взять за основу какую-нибудь CSS библиотеку, например bootstrap.
Код:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Код:
@media (min-width: 1280px) {}