Page 236 - Сила CSS3 Освой новейший стандарт

236 • Глава 6. Разные размеры экрана, разный дизайн

Рис. 6.16. Уменьшая размер текста во вступительном абзаце, мы избавляем пользователя
от необходимости долго прокручивать страницу на крошечном экране
мобильного устройства

Вместо добавления ссылок на другие изображения можно уменьшить размер существующих
значков, применив для этого свойство background-size. Недостаток такого подхода в том, что
значки при уменьшении становятся чуть менее четкими; но зато браузер загружает только
один набор изображений.

Двигаясь по странице дальше, вы заметите, что изображения продуктов смотрятся
слишком крупными в контексте такого узкого окна, а сопутствующий текст, наобо-
рот, кажется зажатым в чрезмерно узкий столбец. К счастью, набор значков Yummy,
из которого я взяла эти иллюстрации, содержит изображения в трех размерах:
128 пикселов, 64 пиксела и 48 пикселов. Мы можем выбрать в нашем медиазапросе
фоновые изображения размером 64 пиксела:

www.trk.kg