| |
|
|
| | Прочел несколько статей про адаптивную верстку, но понятного решения по шрифтам не обнаружил.
Все авторы пишут о том, что нужно задавать размер шрифта в относительных единицах или в процентах. При этом реальный размер шрифта браузер будет вычислять исходя из базового значения в 16 рх.
На мой взгляд, это просто один из способов задания размера шрифта и ничего более, ибо будет одинаковый результат при
font-size: 16px;
font-size: 1em;
font-size: 100%;
В чем же здесь адаптивность?
Можно ли сделать так, чтобы размер шрифта действительно адаптировался к ширине экрана? | |
| |
|
|
| |
|
|
| |
для: Владимир55
(17.10.2013 в 10:58)
| | | У шрифтов есть еще одна особенность - если на Windows шрифт Arial есть, то на других платформах, это большой вопрос, поэтому в стилях задают семейство шрифтов, которые присущи той или иной платформе. Но эти шрифты имеют различное значение аспекта - отношения размера шрифта к высоте глифов нижнего регистра шрифта.
Поэтому свойства шрифта с учетом этого нужно устанавливать так - http://www.umade.ru/resources/specifications/CSS2/fonts.html#font-size-props.
Почитайте вообще эту страницу всю, она может и сложная сразу для восприятия, но полезная.
Ну а адаптивных шрифтов, то есть "сами с усами и сами поймут", конечно же нет. ) И для адаптивной верстки размер шрифта должен быть в относительных единицах, это из смыла самого понятия "адаптация" вытекает. | |
| |
|
|
| |
|
|
| |
для: confirm
(17.10.2013 в 11:59)
| | | Статья великолепная!
Но все же остается вопрос: существует ли способ организации шрифта таким образом, чтобы его размер увеличивался пропорционально ширине экрана?
По сути, как я себе представляю, если все размеры заданы в относительных единицах, то адаптация сводится к изменению базового размера шрифта.
То есть, если на экране шириной 1024 рх базовый шрифт 10рх, то при переходе на разрешение 1248 пикселей базовый шрифт должен автоматически измениться на размер 12рх. И тогда визуально расположение слов абзаца не изменится.
Очевидно, что это можно сделать, если браузер передаст на сервер ширину экрана устройства, на котором производится просмотр, но почему-то я не встретил таких решений ни в одной статье.
К тому же, неизвестно, все ли браузеры передают на сервер эту инфу, в частности браузеры мобильников. | |
| |
|
|
| |
|
|
| |
для: Владимир55
(17.10.2013 в 13:28)
| | | Не нужно ничего передавать браузеру, у CSS есть такое понятие как типы носителя, экран один из них.
Нет у меня сейчас времени много писать. Посмотрите здесь, там есть об адаптивной верстке - инструменты, примеры, готовые сетки и шаблоны для нее. Можете проанализировать готовый шаблон, чтобы, если и не совсем понять, то иметь представление что такое адаптивная верстка. | |
| |
|
|
