Непрозрачность содержимого в контейнере - PullRequest
Новая
       9

Непрозрачность содержимого в контейнере

1 голос
/ 27 апреля 2011

У меня есть контейнер с background-color, установленным с помощью CSS. В этом контейнере есть еще 4 div с. Я хочу отобразить контейнер с непрозрачностью 0.5. Однако когда я это делаю, содержимое контейнера также отображается с непрозрачностью 0.5. Можно ли как-то отобразить содержимое контейнера с полной непрозрачностью?

Ответы [ 5 ]

6 голосов
/ 27 апреля 2011

CSS 3 представляет цвета rgba . Вы можете комбинировать их с полупрозрачными PNG фоновыми изображениями для обратной совместимости . 

#alpha {
    background: url(blue_0.5_pixel.png);
    background: rgba(0%, 0%, 100%, 0.5);
}
2 голосов
/ 27 апреля 2011

Все: opacity: 0.5;
Только фон: background-color: rgba(0, 0, 0, 0.5);

Хотя некоторые браузеры могут не поддерживать RGBA, поэтому обязательно посмотрите.

1 голос
/ 27 апреля 2011

Используйте функцию цвета фона RGBA.

.containerclass { background-color: rgba(255, 255, 128, .5); }
0 голосов
/ 28 апреля 2011
0 голосов
/ 27 апреля 2011

Для браузеров, которые поддерживают CSS3, вы можете использовать полупрозрачный цвет.Вы также можете использовать полупрозрачный PNG для фона, но это не поддерживается в IE6 (если это проблема).

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

...