Оригинал сообщения
Комментарии: [показать]

Спонсор месяца:

Санкт-Петербург аренда квартир - размещение в Спб, альтернатива гостиницам.

Модель RGBa отличается от RGB тем, что позволяет дополнительно указать прозрачность цвета. Это выглядит так:

div {

background: rgba(200, 54, 54, 0.5);

}

Этот код выполняет тоже самое, что и привычное нам написание background и opacity. Но последнее делает прозрачным все дочерние слои и способов решения этой проблемы нет (кроме хаков с позиционированием). Кроме того, для разных браузеров приходится прописывать как минимум 3-4 названия этого свойства (opacity, filter: alpha(opacity=X), -moz-opacity, -khtml-opacity).

С помощью модели RGBa мы можем сделать слой прозрачным, не затрагивая его дочерние элементы:

[500x314]

Но, как вы уже догадались, не все браузеры поддерживают RGBa, поэтому вам придется дополнительно прописывать background с RGB моделью, т.е. просто цвет. Если вы этого не сделаете то, соответсвенно, слой будет без цвета.

div {

background: rgb(200, 54, 54); /* Проверка поддержки */

background: rgba(200, 54, 54, 0.5);

}

Поддержка браузерами модели RGBa

Браузер, версия, OS	Поддержка	Проверка RGB
Firefox 3.0.5 (OS X, Windows XP, Vista)	Works	—
Firefox 2.0.0.18 (PC)	Doesn’t Work	Solid Color
Safari 4 (Developer Preview, Mac)	Works	—
Safari 3.2.1 (PC)	Works	—
Mobile Safari (iPhone)	Works	—
Opera 9.6.1	Doesn’t Work	Solid Color
IE 5.5 (PC via IETester)	Doesn’t Work	No Color
IE 6 (PC via IETester)	Doesn’t Work	Solid Color
IE 7	Doesn’t Work	Solid Color
IE 8 beta 2	Doesn’t Work	Solid Color
Google Chrome 1.0.154.43	Works	—
Google Chrome 1.0.154.46	Works	—
Netscape 4.8 (PC)	Doesn’t Work	No Color
SeaMonkey 1.1.14	Doesn’t Work	Need Info
Sunrise 1.7.5	Works	—
Stainless 0.2.5	Works	—
Flock 2.0.2	Works	—
BlackBerry Storm Browser	Works	—
Camino 1.6.6	Doesn’t Work	Need Info

Данные взяты из этой демо странички, там же представлен более подробный список браузеров. Вот такие вот подводные камни :\

Оригинал статьи - Chris Coyier

[показать]LIci WP - WordPress crossposting plugin