CSS / 4. Значения и единицы измерения

В этой главе мы коснемся элементов, составляющих основу практически всего, что позволяют делать CSS, – единиц измерений (units), применяемых во всех свойствах для задания цвета, расстояний и размеров. Без единиц измерения нельзя объявить о том, что текст абзаца должен быть фиолетовым, или что вокруг изображения должно быть пустое пространство в 10 пикселов, или что текст заголовка должен иметь определенный размер. Поняв основные принципы, изложенные в этой главе, вы намного быстрее изучите и начнете использовать все остальное в CSS.
Статьи раздела '4. Значения и единицы измерения':
URL
Те, у кого есть опыт создания веб-страниц, наверняка хорошо знакомы с URL (или в CSS2.1 – URI). Общий формат обращения к нужному объекту, например, в операторе @import, применяемом при импортировании внешней таблицы стилей, таков:...
Абсолютные единицы измерения длины
Начнем с абсолютных единиц измерения, потому что они проще для понимания, несмотря на тот факт, что они практически не применяются в разработке веб-страниц. Вот пять типов абсолютных единиц измерения: Дюймы (in) Как вы, возмо...
Единицы измерения CSS2
В добавление к рассмотренным в рамках CSS2.1, рассмотрим несколько дополнительных единиц измерений, которые содержит CSS2. Все они имеют отношение к звуковым таблицам стилей (применяемым теми броузерами, которые могут воспроизводи...
Единицы измерения em и ex
Сначала, однако, рассмотрим em и ex. В CSS один «em» – это значение свойства font-size заданного шрифта. Если для элемента font-size равен 14 пикселам, тогда для него же 1em равен 14 пикселам. Очевидно, что это значение может меня...
Единицы измерения длины
Многие свойства CSS, такие как отступы, зависят от мер длины для обеспечения правильного представления различных элементов страниц. Поэтому неудивительно, что в CSS для измерения длины существует множество способов. Все единицы из...
Измерение длин в пикселах
На первый взгляд с пикселами все довольно просто. Если присмотреться к монитору достаточно пристально, то можно увидеть, что его изображение представляет собой сетку из крошечных точек. Каждая точка – это пиксел. Определим элемент...
Ключевое слово inherit
Существует одно ключевое слово, которое используется всеми свойствами CSS2.1: inherit. Оно делает значение свойства таким же, как и у его родительского элемента. В большинстве случаев не надо задавать наследование, потому что боль...
Ключевые слова
Ключевые слова существуют с тех пор, как в качестве значений используются некоторые определенные слова. Очень распространенный пример – ключевое слово none, отличающееся от 0 (нуля). Так, чтобы удалить подчеркивание ссылок в HTML-...
Относительные единицы измерения длины
Относительные единицы измерения получили такое название потому, что они измеряются относительно других единиц измерения. Измеряемое ими фактическое (или абсолютное) расстояние может меняться под действием внешних факторов, таких к...
Практические трудности с применением em и ex
Конечно, все, о чем я только что говорил, сплошная теория. Я показал, что должно происходить, но на практике многие агенты пользователя вычисляют значение ex путем деления значения em на два. Почему? Большинство шрифтов не имеют в...
Процентные значения
Процентное значение (percentage value) – это вычисляемое вещественное число, за которым следует знак процента (%). Процентные значения практически всегда выражены относительно другого значения, которым может быть все что угодно, в...
Работа с абсолютными длинами
Если разрешение экрана монитора составляет 1024 пиксела в ширину и 768 пикселов в высоту, размеры экрана составляют 14,22 дюйма в ширину и 10,67 дюйма в высоту, а область отображения занимает весь экран монитора, то размеры каждог...
Теория пикселов
Так почему же все-таки пикселы определены как относительные единицы измерения длины? Я говорил, что пикселы – это крошечные цветные точки на экране монитора. Но сколько таких точек в дюйме? Это может показаться нелогичным, но немн...
Цвет
Один из первых вопросов, задаваемых каждым начинающим автором веб-страниц: «Как устанавливать цвета на странице?». HTML предоставляет на выбор два варианта: взять один из немногочисленных именованных цветов, такой как red или purp...
Цветовая модель RGB
Компьютеры создают цвета путем комбинирования различных уровней красного, зеленого и синего. Такую комбинацию часто называют цветовой моделью RGB. Кстати, если открыть старый ЭЛТ-монитор компьютера и залезть в проекционный кинеско...
Числа
В CSS существует два типа чисел: целые (integer) и вещественные (real). Эти типы чисел в большинстве случаев служат базой для всех остальных типов значений, но иногда в качестве значений свойств могут выступать числа других формат...
Что делать?
Имея в виду все связанные с этим вопросом трудности, лучше всего, вероятно, использовать относительные единицы измерения, в первую очередь, em и при необходимости – px. Поскольку ex в большинстве применяемых сейчас броузеров, как ...

Страницы: 1