Отправляет email-рассылки с помощью сервиса Sendsay

Рецепты HTML

Рассылка закрыта

Вы можете найти рассылки сходной тематики в Каталоге рассылок.

←   Декабрь 2002   →
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
Автор
Влад Мержевич

Статистика

12.722 подписчиков
-26 за неделю
←   Все выпуски   →

Рецепты HTML


Информационный Канал Subscribe.Ru
www.htmlbook.ru
   Новости сайта www.htmlbook.ru
Добрый день.

На сайте появилась статья посвященная установке цветов фона и текста с помощью CSS. Адрес статьи www.htmlbook.ru/css/color.shtml
Также интересные темы в форуме о вставке таблиц в HTML и другое.

Цвета с помощью CSS

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

В таблице перечислены свойства элементов, предназначенных для задания цвета.

Свойство Значение NC IE Op Описание Пример
color

Цвет
4+
3+
 3+ Устанавливает цвет текста P { color: #330000 }
background-color Цвет
transparent
4+
4+
 3+ Цвет фона BODY { background-color: #6699FF }
background-image
 URL
none
4+
4+
 3+ Фоновый рисунок BODY { background-image: url (bg.gif) }
background-repeat repeat
repeat-x
repeat-y
no-repeat
4+
4+
 3+ Повторяемость фонового рисунка BODY { background-image: url (bg.gif) background-repeat: repeat-y }
background-attachment scroll
fixed
6
4+
4+
 Прокручиваемость фона вместе с документом BODY { background-image: url (bg.gif) background-attachment: fixed }
background-position Проценты
Пикселы
top
center
bottom
left
right
6
4+
3+
 Начальное положение фонового рисунка BODY { background-position: left top }

NC - Netscape Communicator, IE - Microsoft Internet Explorer,Op - Opera; 4+ означает, что свойство поддерживается в браузере 4 версии и выше.

Установка цвета

Цвет, используя CSS, можно задавать тремя способами.

1. По его названию
Браузеры поддерживают некоторые цвета по их названию. Полный список цветов приведен в статье Названия цветов.

P { color: navy; background-color: yellow }

2. По шестнадцатеричному значению
Цвет можно устанавливать по его шестнадцатеричному значению, как и в обычном HTML.

P { color: #F9E71A; background-color: #98560F }

3. С помощью RGB
Можно определить цвет используя значения красной, зеленой и синей составляющей в десятичном исчислении. Значение каждого из трех цветов может принимать значения от 0 до 255. Также можно задавать цвет в процентном отношении.

P { color: RGB(249, 231, 16); background-color: RGB(85%, 24%, 5%) }

 

Установка цвета фона и фонового рисунка

Цвет фона определяется значением параметра background-color, а изображение, которое используется в качестве фона, задается параметром background-image. Значением по умолчанию для цвета фона является transparent, который задает прозрачный фон. Для указания фонового рисунка используется абсолютный или относительный адрес к файлу. Рекомендуется задавать одновременно фоновый рисунок и цвет фона, который будет использоваться в случае недоступности файла изображения.

BODY { background-color: #98560F; background-image: url(/images/bg.gif) }

Если задано фоновое изображение, то свойство background-repeat определяет его повторяемость и способ, как это делать. Допустимыми значениями являются repeat (повторяемость по вертикали и горизонтали), repeat-x (по горизонтали), repeat-y (по вертикали) и no-repeat (только один рисунок, без повторения).

BODY { background-image: url(/images/bg.gif); background-repeat: repeat-y }

В примере фоновый рисунок повторяется по вертикали.

Положение фона определяется параметром background-position. У него два значения, положение по горизонтали (может быть - right, left, center) и вертикали (может быть - top, bottom, center). Положение можно, также, задавать в процентах, в пикселах или других абсолютных единицах.

BODY { background-attachment: fixed; background-image: url(mybg.gif); background-repeat: no-repeat; background-position: right bottom }

В примере фон будет помещен в правый нижний угол страницы. Если нужно определить рисунок в левом верхнем углу, то надо задать следующий вид: background-position: left top.

Параметр background-attachment: fixed фиксирует фон, чтобы он оставался неподвижным при прокрутке содержимого окна браузера.

Примечание:
Позиционирование фона и его фиксация не работает в браузере Netscape 4.


  Разделы сайта
 
Создание сайта
  HTML
  CSS
  Графика
  Дизайн
  Инструментарий
  Справочная информация
  Форум

  Подписка на новости
  Введите ваш e-mail:
  Помощь
  Не знаете с чего начать или что можно найти на сайте www.htmlbook.ru - воспользуйтесь Помощником по сайту
Copyright 2002 Влад Мержевич, e-mail: vlad@htmlbook.ru
Материалы сайта охраняются законом об авторском праве.
Вы можете свободно использовать и распространять любые статьи с указанием автора и ссылки на сайт www.htmlbook.ru.
http://subscribe.ru/
E-mail: ask@subscribe.ru 		Отписаться
Убрать рекламу
В избранное