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

Свой сайт - это очень просто!

  Все выпуски  

Свой сайт - это очень просто! Свойства цвета и фона


Информационный Канал Subscribe.Ru


Сводная таблица свойств CSS. Каскадные таблицы стилей. Свойства цвета и фона.
29.10.2003 Свой сайт - это очень просто! нр 46.

Доброго Вам здоровья уважаемые подписчики!

   Тихо и незаметно, в суете и хлопотах проскочила незамеченной знаменательная дата: 2 года со дня выхода первого номера рассылки Свой сайт - это очень просто! (он вышел в Сеть 20 октября 2001 года.) Но, говорят, что лучше поздно, чем никогда. Поэтому я поздравляю сегодня с этой датой себя, ну и Вас, уважаемые читатели, тоже. От Вас, как всегда, поздравления принимаются в Гостевой книге сайта. В связи с этим маленьким юбилеем я опять провожу подсчет своих активных читателей и прошу Вас мне помочь в этом. Для этого Вам достаточно посетить эту страничку. Поскольку на нее можно попасть только отсюда, я буду точно знать, сколько человек прочли этот выпуск.
   Сегодня в выпуске:
    Новости сайта:

Каскадные таблицы стилей. Свойства цвета и фона.

color Устанавливает цвет текста элемента. Цвет может быть задан:
  • стандартным названием (например, синий — blue),
  • соотношением используемых цветов в режиме RGB.
      Здесь также возможно несколько вариантов:
    • цвет в режиме RGB, записанный в десятичной системе.
           Например тот же синий цвет в десятичной системе запишется так: 0, 0, 255
    • цвет в режиме RGB, записанный в 16-ричной системе счисления.
              Например: #0000ff (синий цвет)
    • цвет в режиме RGB, записанный в процентном соотношении цветов.
              Например: 160%, 240%, 120% (синий цвет)
      p {color: blue;},
      p {color: rgb(0,0,255);},
      p {color: #0000ff;},
      p {color: rgb(160%,240%,120%);}
background-color Определяет цвет фона. При этом, если вы примените это свойство к различным селекторам тегов, то получите и различные результаты: при применении этого свойства к body — в указанный цвет окрасится вся Web-страничка. При применении этого свойства к тексту — окрасится цвет фона текста. При этом, Explorer отведет под фон текста всю доступную ширину страницы, а Netscape Navigator — лишь ширину, занимаемую этим текстом.

Пример:

В приведенном ниже примере фон текста будет темно-синим, цвет текста — белым:
<p style="background-color: #000066; color: white">
Вот так:

Пример надписи белым цветом на синем фоне.

Правила задания цвета фона точно такие же, как и в случае указания цвета текста.
body {background-color: blue;};
p {background-color: blue;}
background-image С помощью этого свойства можно указать URL картинки, которую вы хотите использовать в качестве фона. Как всегда, лучше пользоваться относительной адресацией.

body {background-image: URL('./img/fon.gif')}

background-attachment Определяет, будет или нет фоновая картинка прокручиваться при прокрутке страницы. Возможны следующие значения:
  • fixed — фон прокручиваться не будет; в Netscape не работает;
  • scroll — фон будет прокручиваться вместе с прокруткой страницы.

body {background-attachment: fixed;}

background-repeat Определяет, повторяется ли фоновая картинки для заполнения страницы или элемента. Если используются значения repeat-x, repeat-y, то картинка повторяется лишь вдоль одного направления. По умолчанию картинка повторяется по всем направлениям. Возможны следующие значения:
  • repeat — фоновая картинка повторяется по всем направлениям;
  • repeat-x — фоновая картинка повторяется по горизонтали;
  • repeat-y — фоновая картинка повторяется по вертикали;
  • no-repeat — фоновая картинка не повторяется.

body {background-repeat: repeat-y;}
p {background-repeat: no-repeat;}

background-position Определяет начальное положение фоновой картинки с помощью двух значений — отступа по горизонтали (слева) и отступа по вертикали (сверху). Порядок задания значений: сначала по горизонтали, потом по вертикали. Используется совместно со свойством background-repeat равным repeat-x, repeat-y или no-repeat. Возможные значения:
  • left (лево), center (центр), right (право) — положение фоновой картинки по горизонтали;
  • top (сверху), center (середина), bottom (низ) — положение фоновой картинки по вертикали;
  • расстояние от левого края + расстояние от вершины, используя стандартные единицы
      измерения;
  • процент от ширины + процент от высоты.

    body {background-position: 50% 0%; background-repeat: no-repeat;} посмотреть пример

background Обобщает вышеперечисленные свойства, позволяя одновременно устанавливать несколько свойств фона документа. Различные значения отделяются друг от друга пробелами. Возможные значения:
  • background-color;
  • background-image;
  • background-attachment;
  • background-repeat;
  • backgroun-position.

body {background: white url('./img/FonPr.gif') fixed no-repeat 50% 0% ;}


Интересующимся заработком в сети:
В октябре месяце деньги получены от почтовика Opt-in-Pays
и
кликовых спонсоров TheСlickVault и LinkBurst.

Как всегда, приглашаю Вас посетить Свой сайт - это очень просто!. И, как всегда, Вы можете задавать мне любые вопросы.
    Всего Вам доброго.
   Сергей Червонящий.
на главную

http://subscribe.ru/
E-mail: ask@subscribe.ru
Отписаться
Убрать рекламу

В избранное