Прежде, чем прейти к остальным свойствам фона, связанным с изображениями, упомянем еще одно, специальное, значение, свойства background-color transparent (прозрачность), поскольку именно оно используется по умолчанию.
В данном случае такая запись полностью аналогична предыдущей. Отметим так же, что действие назначенного фона распространяется на область содержимого и внутренних полей элемента.
Здесь мы определили серебристый (светло-серый) цвет для абзацев. Собственно, мы уже не раз применяли назначение цвета фона, правда, при этом использовалось сокращенное свойство background:
В свете уже рассмотренного свойства color, свойство background-color является самым простым его использование аналогично, с той лишь разницей, что вместо цвета переднего плана (скажем, текста) изменится цвет фона:
В качестве фона элемента (поверхности, на которой он отображается) можно указывать цвет или изображение. Всего для определения фона в CSS предусмотрено 5 уникальных свойств: background-color, background-image, background-repeat, background-attachment и background-position, а так же 1 сокращенное background.
Совместимость: все.
Применяется: ко всем элементам.
Наследуемые значения: да.
Значение по умолчанию: зависит от браузера (как правило, черный).
Подобные значения цвета используются не только для указания цвета переднего плана, но и во всех других случаях, где требуется определение цвета. В качестве примера из уже рассмотренных свойств можно привести border (вернее, border-color), а из не рассмотренных фон (background), о котором речь далее и пойдет.
em {color: rgb(20%, 40%, 60%);}
Здесь мы вновь определили красный цвет: в функции rgb первое значение определяет интенсивность красного цвета, второе зеленого, а третье синего. Таким образом, для составного цвета следует использовать два или все три значения:
В обоих случаях это будет полностью насыщенный красный цвет (FF максимальная интенсивность красного канала, соответствующая 8 битам). Если вы программист, то такое представление будет для вас привычным и достаточно удобным. Однако для других категорий разработчиков web-страниц шестнадцатеричная система счисления вовсе не является привычной, поэтому в CSS и появилась функция rgb, позволяющая указывать интенсивность составляющих цвета в десятичной нотации (от 0 до 255) и в процентах:
До сих пор мы в примерах преимущественно использовали назначение цветов при помощи ключевых слов. Это удобно для простых цветов (red, green, gray и т.д.), однако вряд ли вы будете на практике использовать такие обозначения, как mediumspringgreen или lightgoldenrodyellow (см. файл Part_1\colors.html). Кроме того, использование числовых значений позволяет добиться большей гибкости при подборе цвета. В XHTML применяются шестнадцатеричные значения, они же поддерживаются и в CSS:
С самим свойством все просто, гораздо интереснее обстоят дела с его значениями. Дело в том, что в CSS предусмотрено целых 5(!) вариантов для определения значения цвета: один при помощи ключевого слова, два в шестнадцатеричной нотации, и еще два при помощи функции rgb. Что касается первых способов, то все, что было сказано про цвета в HTML, верно и для CSS: они задаются точно теми же ключевыми словами и точно в том же порядке следуют основные цвета в шестнадцатеричном определении (RGB или RRGGBB).
Для указания цвета переднего плана в CSS используется свойство color:
Ряд свойств из этого раздела регулярно упоминались выше, в частности, цвета переднего плана и фона, а так же ряд свойств font. В этой главе мы подробно рассмотрим эти и ряд иных, ранее не упоминавшихся свойств, предназначенных для визуального оформления страниц.
Ознакомившись практически со всеми основополагающими (и, пожалуй, самыми сложными) концепциями таблиц стилей второго уровня, перейдем к наиболее часто применяемым на практике свойствам, в основном, ради которых изначально и предназначались таблицы стилей. Конечно же, это цветовое и шрифтовое оформление документов.
Оформление текста в CSS
Каскадные таблицы стилей - Оформление текста в CSS
Комментариев нет:
Отправить комментарий