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

Уроки веб-дизайна с подробными примерами #13


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

Доброго Вам времени суток, уважаемые подписчики!

Представляю Вашему вниманию тринадцатый выпуск рассылки "Уроки веб-дизайна в примерах". В этом выпуске рассмотрим использование графики с помощью CSS.


Содержание выпуска:
Графика.

Цвет фона или фоновое изображение можно задать с помощью свойств тега BODY. Однако, согласно современной идеологии стандартов HTML, необходимо избегать явного задания свойств тега BODY. Вместо этого необходимо использовать средства CSS. Приведем фрагмент стилевого файла:

body {
background-color: #FFF;
background-image: url("bg.gif");
background-attachment: scroll;
color: #000;
}

Свойство background-color задает цвет фона, свойство background-image определяет фоновое изображение, background-attachment задает способ прокрутки фонового изображение (значения scroll - прокрутка вместе с текстом, fixed - фоновое изображение фиксировано). В последней строчке свойство color определяет цвет символов по умолчанию. Конечно же, применять эти свойства стиля можно практически к любому объекту.

Фильтры

Достаточно богатым инструментом для работы с графикой представляют собой фильтры. Приведем пример подключения фильтров с использованием таблиц стилей.

Фильтры могут применяться не ко всем элементам HTML. К следующим элементам фильтры могут применяться всегда: BODY, BUTTON, IMG, INPUT, MARWUEE, TABLE, TD, TEXTAREA, TH. Фильтры можно применять к следующим тегам, только если заданы свойства ширины WIDTH и высоты HEIGHT или при абсолютном позиционировании элемента: DIV, SPAN. Фильтры нельзя применят к элементам: JAVA, IFRAME, SELECT, OPTION, P, EM, STRONG, H1, ..., H6,

Класс соответствующий определенному фильтру задается в виде:

.ClassName{filter:FilterName(Parameter1='Value', Parameter2='Value');}

Здесь ClassName - имя класса, FilterName - имя фильтра, Parameter='Value' - пары параметр=значение, настраивающие действие фильтра. У различных фильтров может быть разное число параметров, или не быть ни одного. Несколько параметров задаются через запятую. При применении нескольких фильтров к одному объекту список фильтров задается через пробел.

Фильтры могут применяться не ко всем элементам HTML. Ко следующим элементам фильтры могут применяться всегда: BODY, BUTTON, IMG, INPUT, MARWUEE, TABLE, TD, TEXTAREA, TH. Фильтры можно применять к следующим тегам, только если заданы свойства ширины WIDTH и высоты HEIGHT или при абсолютном позиционировании элемента: DIV, SPAN. Фильтры нельзя применят к элементам: JAVA, IFRAME, SELECT, OPTION, P, EM, STRONG, H1, ..., H6,

Класс соответствующий определенному фильтру задается в виде:

.ClassName{filter:FilterName(Parameter1='Value', Parameter2='Value');}

Здесь ClassName - имя класса, FilterName - имя фильтра, Parameter='Value' - пары параметр=значение, настраивающие действие фильтра. У различных фильтров может быть разное число параметров, или не быть ни одного. Несколько параметров задаются через запятую. При применении нескольких фильтров к одному объекту список фильтров задается через пробел.

Список всех доступных фильтров приведен ниже:

    Текстовые фильтры
  • Размытие текста (Blur)
  • Тень (DropShadow)
  • Горизонтальный поворот объекта (FlipH)
  • Вертикальный поворот объекта (FlipV)
  • Сияние (Glow)
  • Маска (Mask)
  • Тень (Shadow)
  • Волнистый текст (Wave)
    Графические фильтры
  • Прозрачность (Alpha)
  • Размытость (Blur)
  • Горизонтальный поворот объекта (FlipH)
  • Вертикальный поворот объекта (FlipV)
  • Инверсия (Invert)
  • Тона серого (Gray)
  • Прозрачность для одного цвета (Chroma)
  • Негативное изображение (Xray)
  • Волнистый текст (Wave)
  • Анимированное появление изображения (RevealTrans)

Здесь вы можете посмотреть использование всех видов фильтров на примере фотографии очаровательной французской ящерицы, живущей на альпийских лугах вблизи границы с Италией.

Анонс следующего выпуска

В следующем выпуске будут приведены готовые коды для различных фильтров.

Новости сайта/полезные ссылки

Добавлен новый раздел: Фильтры и SSI - server side includes - динамические сайты на стороне сервера.

P.S. Если Вы используете почтовую программу The Bat!, то письмо может отображаться некорректно. Для того, чтобы просмотреть правильный вариант, щелкните два раза на аттачменте Part.html и откройте письмо (кнопка "No/Нет").


http://subscribe.ru/
http://subscribe.ru/feedback/
Подписан адрес:
Код этой рассылки: comp.design.www
Отписаться

В избранное