Поддержка браузерами функции RGBa. - «Верстка»
Меню
Наши новости
Учебник CSS

Невозможно отучить людей изучать самые ненужные предметы.

Введение в CSS
Преимущества стилей
Добавления стилей
Типы носителей
Базовый синтаксис
Значения стилевых свойств
Селекторы тегов
Классы
CSS3

Надо знать обо всем понемножку, но все о немногом.

Идентификаторы
Контекстные селекторы
Соседние селекторы
Дочерние селекторы
Селекторы атрибутов
Универсальный селектор
Псевдоклассы
Псевдоэлементы

Кто умеет, тот делает. Кто не умеет, тот учит. Кто не умеет учить - становится деканом. (Т. Мартин)

Группирование
Наследование
Каскадирование
Валидация
Идентификаторы и классы
Написание эффективного кода

Самоучитель CSS

Вёрстка
Изображения
Текст
Цвет
Линии и рамки
Углы
Списки
Ссылки
Дизайны сайтов
Формы
Таблицы
CSS3
HTML5

Новости

Блог для вебмастеров
Новости мира Интернет
Сайтостроение
Ремонт и советы
Все новости

Справочник CSS

Справочник от А до Я
HTML, CSS, JavaScript

Афоризмы

Афоризмы о учёбе
Статьи об афоризмах
Все Афоризмы

Видео Уроки


Наш опрос



Наши новости

       
28-11-2009, 13:00
Поддержка браузерами функции RGBa. - «Верстка»
Рейтинг:


RGBa - это функция, используемая в CSS для определения цвета с альфа-каналом. Используется
она следующим образом:


div{
background: rgba(200, 54, 54, 0.5);
}


Это позволяет нам заполнить какую-либо область полупрозрачным цветом. Кроме того,
мы знаем, что есть очень похожее свойство opacity, но оно применяется ко
всем дочерним элементам и обходится это только при использовании хаков.



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






Альтернативный цвет.



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


div {
background: rgb(200, 54, 54); /* Альтернативный цвет */
background: rgba(200, 54, 54, 0.5);
}


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








































































































Браузер, версия, платформа

Результат

Альтернатива

Firefox 3.0.5 (OS X, Windows XP, Vista)

Работает



Firefox 2.0.0.18 (PC)

Не работает

Сплошной цвет.

Safari 4 (Developer Preview, Mac)

Работает



Safari 3.2.1 (PC)

Работает



Mobile Safari (iPhone)

Работает



Opera 9.6.1

Не работает

Сплошной цвет

IE 5.5 (PC via IETester)

Не работает

Без цвета

IE 6 (PC via IETester)

Не работает

Сплошной цвет

IE 7

Не работает

Сплошной цвет

IE 8

Не работает

Сплошной цвет

Google Chrome 1.0.154.43

Работает



Google Chrome 1.0.154.46

Работает



Netscape 4.8 (PC)

Не работает

Без цвета

SeaMonkey 1.1.14

Не работает



Sunrise 1.7.5

Работает



Stainless 0.2.5

Работает



Flock 2.0.2

Работает



BlackBerry Storm Browser

Работает



Camino 1.6.6

Не работает




Лучший способ для альтернативного цвета в IE



Для IE мы можем испльзовать фильтр CSS от Microsoft. Этот фильтр даёт точно такой же результат:


<!--[if IE]>
<style type="text/css">
.color-block {
background	: transparent;
filter		: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
zoom		: 1;
}
</style>
<![endif]-->


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



  1. CSS Box-Model

  2. О свойстве float

  3. О свойстве overflow


Было бы интересно услышать ваше мнение, интересно ли это вам и стоит ли вообще их переводить.


RGBa - это функция, используемая в CSS для определения цвета с альфа-каналом. Используется она следующим образом: Это позволяет нам заполнить какую-либо область полупрозрачным цветом. Кроме того, мы знаем, что есть очень похожее свойство opacity, но оно применяется ко всем дочерним элементам и обходится это только при использовании хаков. С помощью RGBa, мы можем сделать полупрозрачным только один элемент, не применяя свойство к дочерним. Альтернативный цвет. Не все браузеры поддерживают RGBa. Таким образом, если дизайн позволяет, то необходимо объявлять альтернативный цвет. Если его не объявлять, то браузер не будет применять цвет для этого элемента вообще. Но даже этот способ не работает, в действительно старых браузерах. Поддержка браузерами RGBa. Браузер, версия, платформа Результат Альтернатива Firefox 3.0.5 (OS X, Windows XP, Vista) Работает — Firefox 2.0.0.18 (PC) Не работает Сплошной цвет. Safari 4 (Developer Preview, Mac) Работает — Safari 3.2.1 (PC) Работает — Mobile Safari (iPhone) Работает — Opera 9.6.1 Не работает Сплошной цвет IE 5.5 (PC via IETester) Не работает Без цвета IE 6 (PC via IETester) Не работает Сплошной цвет IE 7 Не работает Сплошной цвет IE 8 Не работает Сплошной цвет Google Chrome 1.0.154.43 Работает — Google Chrome 1.0.154.46 Работает — Netscape 4.8 (PC) Не работает Без цвета SeaMonkey 1.1.14 Не работает — Sunrise 1.7.5 Работает — Stainless 0.2.5 Работает — Flock 2.0.2 Работает — BlackBerry Storm Browser Работает — Camino 1.6.6 Не работает — Лучший способ для альтернативного цвета в IE Для IE мы можем испльзовать фильтр CSS от Microsoft. Этот фильтр даёт точно такой же результат: Вопрос к читателям. Есть несколько статей, которые вроде бы и можно перевести, но не знаю, на сколько это вас заинтересует. Статьи такие: CSS Box-Model О свойстве float О свойстве overflow Было бы интересно услышать ваше мнение, интересно ли это вам и стоит ли вообще их переводить.

Теги: CSS, работаетСплошной цветIE способ работаетБез (PC)Не

Просмотров: 1 581
Комментариев: 0:   28-11-2009, 13:00
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь. Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

 
Еще новости по теме:



Другие новости по теме: