Page 230 - Сила CSS3 Освой новейший стандарт
P. 230
230 • Глава 6. Разные размеры экрана, разный дизайн
документ и откройте его в современном браузере. Поменяйте размер окна и пона-
блюдайте за изменениями дизайна в очень узком и очень широком окне.
Рис. 6.13. Благодаря уменьшению размера текста и расстояния между символами
в заголовках боковой полосы буквы не вылезают за пределы
поля даже в очень узком окне
изменение макета для ПрОсмОтра на мОбильных устрОйствах
Если вы с усердием меняли размер окна, тестируя стили для узкой области просмо-
тра, то, вероятно, заметили, что даже с внесенными изменениями макет не очень
хорошо смотрится в чрезвычайно узкой области просмотра, какая бывает, напри-
мер, на мобильных устройствах. Что ж, это говорит лишь о том, что мы должны
добавить еще один медиазапрос.
Медиазапросы помогают быстро и просто настраивать стили для мобильных
устройств. Однако обратите внимание: я не утверждаю, что это единственный спо-
соб настройки мобильных сайтов. Возможно, вам понадобится добавить сценарии
на серверную сторону или применить другие техники изменения содержимого и
функциональности мобильной версии сайта. Медиазапросов может быть достаточно
для настройки мобильной версии сайта-визитки небольшой компании (такого как
в нашем примере). Но большой, сложный новостной сайт требует использования
дополнительных методов и значительной корректировки содержимого, навигации
и прочей функциональности мобильного сайта. К тому же скрывать или подменять
содержимое исключительно с помощью медиазапросов — не очень эффективный
www.trk.kg