CSS3: Единицы измерения шрифтов для адаптивности

CSS3: Единицы измерения шрифтов для адаптивности

Не слежу за новостями веб языков, поэтому иногда удивляюсь новым решениям в верстке старых проблем. Вот, например, натолкнулся на размер шрифтов, которые будут смотреться одинаково на разных разрешениях экранов

font-size: 100%;
font-size: 0.75em;
font-size: 0.75rem;


em и rem - схожи, но первый будет уменьшать шрифт с каждым новым вложением от родительского элемента, а второй берет свои размеры от корневого

<div><div>уменьшится дважды для em и один для rem</div></div>


А вот еще парочка занятных разметок в зависимости от размера браузера:

1vw — 1% ширины устройства отображения.
1vh - 1% высоты устройства отображения.
1vmin — наименьшее значение из 1vw и 1vh.


например, для экрана 1000х1200px:

1.5vw = размер шрифта 15px
1.5vh = размер шрифта 18px
1.5vmin = минимальное значение из 1.5vw и 1.5vh = размер шрифта 15px


Понравилась статья "CSS3: Единицы измерения шрифтов для адаптивности" из раздела Веб разработка » HTML/CSS? Подпишись на RSS. Будь в курсе всего происходящего на сайте
Комментариев: 0 •  Просмотров: 1499   Дата: 26-мая-2015, 23:41

Похожие статьи

Комментарии

b
i
u
s
|
left
center
right
|
emo
color
|
hide
quote
translit

© 2010-2017 devarts.pro v 7.0: flexyflat tpl Designed by devarts
Карта сайта HTMLКарта сайта XMLПравообладателям
Яндекс.Метрика