Это старая версия документа!
# CSS: Единицы измерения
## Применительно к тексту ### Pixels
Пиксель px – это самая базовая, абсолютная и окончательная единица измерения.
Количество пикселей задаётся в настройках разрешения экрана, один px – это как раз один такой пиксель на экране. Все значения браузер в итоге пересчитает в пиксели.
Пиксели могут быть дробными, это совершенно нормально, . ### Percent
Процент - %. Значение процентов высчитывается относительно значения свойства родительского тега. Это значит, что если текст будет вложенным, то его значение будет меняться в зависимости от того тега, в который он вложен.
```html <p>Lorem
<span>Lorem <span>Lorem</span> </span>
</p> ```
```css p {
font-size: 100%;
} p>span {
font-size: 50%;
} p>span>span {
font-size: 400%;
} ```
Учитывая что по-умолчанию браузер использует значение в 16px здесь получим: 16px, 8px и 32px
### VW / VH
Это единицы измерения которые относятся к размеру экрана устройства. Все те значения, которые начинаются с буквы V, имеют в себе сокращение слова с английского «viewport» («область просмотра»). Итак:
* vh = 1/100 высоты области просмотра * vw = 1/100 ширины области просмотра * vmin = 1/100 наименьших высоты или ширины области просмотра * vmax = 1/100 наибольших высоты или ширины области просмотра
Последние два значения, еще не так хорошо поддерживаются браузерами, поэтому будьте осторожны, если захотите использовать их на своих проектах.
Запись ```css .box-vw .text-1 {
font-size: 2vw;
} ```
значит, что на экране монитора, у которого будет значение 1200px, элемент будет равен 24px. Откуда берется это значение? Это 2% от 1200px, то есть 1200px * 0.02 = 24px. При этом если взять, например, планшет, который в среднем составляет ширину 768px, то размер шрифта составит примерно 15px, то есть это 2% от 768px.
(!) _Значения vmin и vmax не применимы к font-size_