Page 77 - Сила CSS3 Освой новейший стандарт

Графические эффекты без графики • 77

Помимо добавления фильтра, правило для IE 7 и предыдущих версий делает еще
одну вещь, а именно — удаляет фоновый
цвет; если соответствующую строку не Для успешной работы с браузерами IE
добавить, то фоновый цвет будет ото- крайне важно понимать концепцию
бражаться вместо градиента. Кроме того, hasLayout. Если вы чувствуете, что вам не
в IE 6 и предыдущих версиях необходи- мешает обновить знания об этом стран-
мо включать для правил blockquote ном «свойстве», рекомендую прочитать
статью автора Ingo Chao «On having layout»
свойство hasLayout, без которого по адресу http://www.satzansatz.de/cssd/
фильтр работать не будет. Именно для onhavinglayout.html.
этого я добавила строку zoom: 1;.

преоБразование значений hSla и rGba для Фильтра GradIEnt
Для того чтобы в градиенте IE получить такую же степень прозрачности цвета, которая была
задана в нотации HSLA, нужно попросту умножить значение прозрачности HSLA (в нашем
случае .6) на 255 и перевести результат в шестнадцатеричную систему. Роберт Найман (Robert
Nyman) объясняет, как это делается, в своей статье по адресу http://robertnyman.com/2010/01/11/
css-background-transparency-without-affecting-child-elements-through-rgba-and-filters.
Проще всего, однако, использовать утилиту Майкла Бестера (Michael Bester) TGBa & HSLa CSS
Generator for Internet Explorer, расположенную по адресу http://kimili.com/journal/rgba-hsla-
css-generator-for-internet-explorer. Вставьте значение RGBA или HSLA, и она автоматически
преобразует его в эквивалентное значение для фильтра Gradient.

В IE 8 фоновый цвет удалять не требуется, так как этот браузер умеет правильно
игнорировать фоновый цвет HSLA в главном правиле blockquote. Также не нужно
включать hasLayout. Однако синтаксис записи свойств фильтра немного отличается.
Добавьте для IE 8 следующее правило:
.ie8 blockquote {
-ms-filter: "progid:DXImageTransform.Microsoft.gradient
(startColorstr=#99A6DADC, endColorstr=#99A6DADC)";
}

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

градиенты Без иСпользования изоБражений
Фон облачков с текстом можно сделать еще привлекательнее путем добавления
легких градиентов. Они придают фигурам более пышный, объемный вид. В CSS3
предусмотрена возможность создания градиентов без использования изображений.
Это не только ускоряет разработку, но и сокращает время загрузки страниц — так

www.trk.kg