русс | укр

Языки программирования

ПаскальСиАссемблерJavaMatlabPhpHtmlJavaScriptCSSC#DelphiТурбо Пролог

Компьютерные сетиСистемное программное обеспечениеИнформационные технологииПрограммирование

Все о программировании


Linux Unix Алгоритмические языки Аналоговые и гибридные вычислительные устройства Архитектура микроконтроллеров Введение в разработку распределенных информационных систем Введение в численные методы Дискретная математика Информационное обслуживание пользователей Информация и моделирование в управлении производством Компьютерная графика Математическое и компьютерное моделирование Моделирование Нейрокомпьютеры Проектирование программ диагностики компьютерных систем и сетей Проектирование системных программ Системы счисления Теория статистики Теория оптимизации Уроки AutoCAD 3D Уроки базы данных Access Уроки Orcad Цифровые автоматы Шпаргалки по компьютеру Шпаргалки по программированию Экспертные системы Элементы теории информации

CSS фильтры: текстовые, тень, прозрачность. Эффекты

К элементам страницы можно применить фильтры для получения разнообразных мультимедийных эффектов. Фильтры разделяются на статические и динамические. Статический фильтр даёт уже готовый вид элемента. Динамический переход создаёт анимационный эффект.

К элементам body, img, input, table, td, th, textarea фильтры применимы безусловно. Элементы div и span должны быть абсолютно позиционированы или иметь в параметре style определения высоты и ширины. Фильтры нельзя применять к заголовкам, элементам iframe, select, option, p, em.

Фильтры задаются свойством Filter: имяФильтра(параметры). К одному элементу можно применить сразу несколько фильтров.

Текстовые фильтры

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

Тень shadow

Применяется для того, чтобы сделать текст объёмным.

shadow(color='цвет', direction=направление)

где цвет тени задаётся кодовым словом или шестнадцатеричным значением а направление падения тени задаётся в градусах относительно 12-ти часов.

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

Отброшенная тень dropshadow

Применяется с той же целью, за текстом появляется его силует.

dropshadow(color='цвет', offx=смещение, offy=смещение)

где смещение задаёт отступ силуета в пикселях по горизонтали и вертикали. Если оба значения положительны, то силует смещается вправо и вниз.

Свечение glow

Создаёт вокруг символов светящийся ореол.

glow(color='цвет', strength=интенсивность)

где интенсивность задаёт ширину свечения в пикселях.

Универсальные фильтры

Следующие фильтры применяются как к тексту, так и к изображениям.

Маска mask

mask(color='цвет')

где цвет заливает прозрачные области объекта, а непрозрачные становятся белыми.

Размытие blur

blur(direction=направление, strength=интенсивность, add={true|false})

где параметр add задаёт или отменяет добавление исходного варианта объекта в отфильтрованное.

Волновое искажение wave

wave(freq=частота, phase=фаза, lightstrength=освещение,
     strength=интенсивность, add={true|false})

где частота задаёт количество пиков волны, а фаза - проценты от синусоиды.

Зеркальное отражение fliph и flipv

Фильтр fliph создаёт отражение по горизонтали, flipv - по вертикали. Оба фильтра без параметров.

Это дача!

Это дача!

Прозрачность alpha

Применяется для создания эффекта прозрачности всего изображения или его частей.

alpha(opacity=прозрачность, style=стиль[, startx=X1, starty=Y1, finishx=X2,      finishy=Y2])

где прозрачность задаётся в процентах, стиль имеет предопределённые значения

  • 0 - фильтр применяется равномерно по всему изображению;
  • 2 - прозрачность изменяется от центра эллипса, вписанного в границы, до краёв;
  • 3 - прозрачность изменяется от центра изображения до краёв;
  • 1 - вдоль отрезка прямой, заданной координатами начала (X1,Y1) и конца (X2,Y2).

Надеюсь, не надо пояснять, какой стиль на каком рисунке применялся.

Если вы не видите эффекты, значит браузер не поддерживает эти css стили.

Просмотров: 18368

Вернуться воглавление


Карта сайта Карта сайта укр


Уроки php mysql Программирование

Онлайн система счисления Калькулятор онлайн обычный Инженерный калькулятор онлайн Замена русских букв на английские для вебмастеров Замена русских букв на английские

Аппаратное и программное обеспечение Графика и компьютерная сфера Интегрированная геоинформационная система Интернет Компьютер Комплектующие компьютера Лекции Методы и средства измерений неэлектрических величин Обслуживание компьютерных и периферийных устройств Операционные системы Параллельное программирование Проектирование электронных средств Периферийные устройства Полезные ресурсы для программистов Программы для программистов Статьи для программистов Cтруктура и организация данных


 


Полезен материал? Поделись:

Не нашли то, что искали? Google вам в помощь!

 
 

© life-prog.ru При использовании материалов прямая ссылка на сайт обязательна.