Я пытаюсь создать приложение HTML5 с кросс-браузерной совместимостью - идеально для мобильных телефонов. Я использую HTML5/CSS3/JavaScript/jQuery (с мобильным телефоном).
На моей домашней странице должно быть шесть квадратных кнопок (изображений), которые сосредоточены на странице, поэтому, если вы представляете себе мобильный экран с двумя колонками, по три квадрата в каждом, в центре.
Я надеялся, что кто-то, у кого больше опыта, сможет направить меня к тому, что является лучшим способом решить эту проблему? Было бы здорово, если бы экран поворачивался горизонтально, чтобы изображения плавали на 3 столбца по 2.
Если у кого-нибудь есть идеи, я бы очень это оценил. Я извиняюсь, что мое описание немного кратки, но я еще не написал код, я хотел посмотреть, что думают люди в первую очередь. Благодарю.
Если вы нажмете кнопки display:inline-block
будет проходить через страницу. Тогда вам просто нужно сосредоточить все, и все готово. Посмотрите эту скрипку на пример.
Чтобы сделать ваше приложение для нескольких размеров экрана устройства... вы можете использовать запросы css media
Кроме того, вы можете указать размеры макета /btn в процентах вместе с использованием медиа-запросов.
Используйте концепцию, называемую веб-отзывчивым дизайном
обращаться
http://msdn.microsoft.com/en-us/magazine/hh653584.aspx http://johnpolacek.github.io/scrolldeck.js/decks/responsive/ http://smallbiztrends.com/2013/05/what -is реагирующий-веб-design.html
Примеры сайтов
http://socialdriver.com/2013/06/50-best-responsive-website-design-examples-of-2013/ http://socialmediatoday.com/jacey-gulden/1687451/10-examples-inspiring-responsive- веб-дизайн