Единицы измерения CSS. Библиотека I2R. Для задания размеров различных элементов, в CSS используются абсолютные и относительные единицы измерения. Абсолютные единицы не зависят от устройства вывода, а относительные единицы определяют размер элемента относительно значения другого размера.

Для задания размеров различных элементов, в CSS используются абсолютные и относительные единицы измерения. Абсолютные единицы не зависят от устройства вывода, а относительные единицы определяют размер элемента относительно значения другого размера.

Относительные единицы

Единица	Описание
em	Высота шрифта элемента
ex	Высота символа x
px	Пиксел
%	Процент

Практически все браузеры вычисляют значение ex как удвоенное em. Возможно это и резонное приближение, но технически неверное.

Пример 1. Использование относительных единиц


           <html>

             <head> 

             <style>

             .em, .ex, .px, .percent { font-family: Verdana, Arial,
             sans-serif }

             .em { font-size: 2em }

             .ex { font-size: 4ex } 

             .px { font-size: 30px } 

             .percent { font-size: 200% }

             </style> 
           <body>

             <span class=em>Размер в em</span> 

             <span class=ex>Размер в ex</span>

             <span class=px>Размер в пикселях</span>

             <span class=percent>Размер в процентах</span>
             

             </body>

             </html>

Размер текстов получился примерно одинаковым, но единицы измерения использовались различные.

Размер в em
Размер в ex
Размер в пикселях
Размер в процентах

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

Абсолютные единицы

Единица	Описание
in	Дюйм (1 дюйм равен 2,54 см)
cm	Сантиметр
mm	Миллиметр
pt	Пункт (1 пункт равен 1/72 дюйма)
pc	Пика (1 пика равна 12 пунктам)

Самой, пожалуй, распространенной единицей является пункт, который используется для указания размера шрифта. Многие люди привыкли задавать размер шрифта в текстовых редакторах, например, 12. А что это число означает, не понимают. Так это именно пункты и есть, они родные. Конечно они нам не родные, мы привыкли измерять все в миллиметрах и подобных единицах, но пункт, пожалуй, единственная величина из не метрической системы измерения, которая используется у нас повсеместно. И все благодаря текстовым редакторам и издательским системам.

Пример 2. Использование абсолютных единиц


           	<html>

             <head> 

             <style>

             .in, .mm, .pt { font-family: Verdana, Arial, sans-serif
             }

             .in { font-size: 0.5in }

             .mm { font-size: 8mm } 

             .pt { font-size: 24pt }

             </style>


           	<body>

             <span class=in>Размер в дюймах</span> 

             <span class=mm>Размер в миллиметрах</span>

             <span class=pt>Размер в пунктах</span>

             </body>

             </html>

Результат использования абсолютных единиц измерения показан ниже.

Размер в дюймах
Размер в миллиметрах
Размер в пунктах

Примечание
Если размеры шрифта на странице заданы в абсолютных единицах, то в опциях браузера эту величину изменить нельзя. Поэтому, размер шрифтов лучше задавать в процентах, что позволит делать их больше или меньше подбирая подходящий для комфортного чтения.

	Библиотека Интернет Индустрии I2R.ru	Малобюджетные сайты... Продвижение веб-сайта... Контент и авторское право...
Забобрить! Блог		Поиск:	Рассылки для занятых...»

Библиотека Интернет Индустрии I2R.ru

Малобюджетные сайты...

Продвижение веб-сайта...

Контент и авторское право...