>>> Перейти на полный размер сайта >>>

Онлайн учебник по HTML

Основы HTML

Цвета и единицы измерения в HTML

В коде HTML-документа нам всегда придется указывать размеры тех или иных объектов оформления Web-страницы, а также цветовые свойства этих объектов. В HTML предусмотрены стандартные правила для обозначения цветов и единиц измерения. Начнем мы с цветовых обозначений.

Предусмотрено два способа задания цвета. Чаще всего используется способ с указанием RGB-кода требуемого цвета. Как известно, любой цвет разлагается на три основных: красный, зеленый и синий. Браузеры позволяют нам отображать более шестнадцати миллионов цветов. Все это многообразие обеспечивается за счет того, Что каждая доля основных цветов может варьироваться от нуля до двухсот пятидесяти пяти, т. е. каждый цвет задается сочетанием трех чисел каждое из которых отражает Долю одного из трех основных цветов. Для удобства обработки в HTML цвет задается в виде группы из шести шестнадцатеричных цифр в следующей форме:

color="#FF0000"

Из примера видно, что перед последовательностью шестнадцатеричных цифр ставится знак решетки. Порядок чисел, указывающих насыщенность основных цветов, должен выдерживаться строго. Сначала — красный, затем — зеленый, и в самом конце — синий. Легко догадаться, что в примере мы установили красный цвет.

Но есть и альтернативный вариант установки цвета. Для щестнадцати наиболее популярных цветов были введены символьные обозначения, приведенные в табл. 1.2.

Таблица 1.2. Цветовые обозначения

С учетом этих обозначений, наш пример с красным цветом мы могли бы написать и вот таким образом:

color="Red"

Так, с цветом разобрались, теперь переходим к рассмотрению единиц измерения длины. Согласно спецификации языка HTML, мы можем указывать размеры каких-либо объектов оформления Web-страниц только двумя способами. Либо указывать их размер в пикселах, либо — в процентном отношении. Процентное соотношение рассчитывается относительно "родительского" объекта, внутри которого и находится данный элемент оформления, т.е., если мы на Web-странице размещаем, скажем, таблицу и указываем, что ее ширина должна составлять пятьдесят процентов, то эти пятьдесят процентов будут рассчитываться от ширины окна просмотра браузера. А уже процентное отношение ширины ячейки таблицы будет рассчитываться от общей ширины именно таблицы, в которой и находится эта ячейка. И если пользователь изменит размеры окна браузера, соответствующим образом изменится и компоновка содержимого Web-страницы. Поэтому, при создании Web-страницы всегда следует изыскивать такие способы размещения содержимого, чтобы их компоновка не изменялась кардинально при изменении размеров окна браузера. Также следует учитывать и тот факт,что удаленные пользователи используют различные разрешения мониторов. О том, как узнать, какое именно разрешение монитора установлено у посетителя Web-страницы, мы выясним в третьей главе, а пока вернемся к единицам измерения размеров объектов Web-страниц.

Для того чтобы указать размер некоего элемента в пикселах, достаточно в качестве значения соответствующего параметра указать необходимое число. Так, если мы захотим установить ширину некоего объекта в тридцать пикселов, следует использовать следующую конструкцию:

width="30"

А если ширина должна составлять тридцать процентов от "родительского" объекта, то мы запишем уже такой код:

width="30%"

Еще раз обращаю внимание на то, что все значения параметров записываются в обрамлении двойных кавычек.
Однако, помимо этих двух способов указания размеров, есть и еще один. Суть его в том, что это нечто среднее между процентным соотношением и прямым указанием размера в пикселах. Мы можем указывать размер, кратный некоторому количеству пикселов. Например, есть у нас таблица, состоящая из трех строк. Высота таблицы задана, причем, неважно, каким способом. Тогда, если мы хотим, чтобы высота каждой строки была кратна тридцати пикселам, то в каждый тег, создающий одну из этих строк, мы должны внести следующий фрагмент кода:

height ="3"

То есть, кратность отсчитывается относительно десятков пикселов. При этом, браузер пытается отобразить такие объекты с максимально возможным размером, т.е., если таблица в высоту имеет размер сто восемьдесят пикселов, то каждая строка займет в высоту по шестьдесят пикселов. Впрочем, то же самое случится, если мы создадим таблицу высотой в двести пикселов. Двадцать лишних пикселов просто пропадут. Поэтому, если необходимо, чтобы наши строки заняли равную высоту, то следует использовать следующий вариант параметра:

height="*"

Впрочем, этот режим действует по умолчанию. Если для группы одинаковых объектов размеры не указаны, они размещаются максимально однородно в пространстве "родительского" объекта.
И это все, что мы можем сказать о единицах измерения, принятых в HTML. На самом деле, мы все-таки имеем возможность задавать абсолютные размеры элементов оформления Web-страниц не только в пикселах. Но для этого необходимо использовать возможности технологии стилевого оформления CSS, которые мы рассмотрим позднее. А сейчас пора переходить к рассмотрению возможностей отображения текста.