У меня проблема. Я хочу прозрачный фон для содержимого div. Но не все содержание в нем. Я не могу получить эту работу:распространение непрозрачности
<div class="notTransparent"> <div class="transparent"></div> content </div>
Есть ли другая работа вокруг ??
Я думаю, что я сделал это раньше (хотя это было много лет назад). То, что вы делаете, имеет div с дисплеем: relative, затем еще один div внутри с дисплеем: absolute, left: 0px, top: 0px, width: 100% и height: 100%. Возможно, примените z-index: -10 (чтобы поместить это за весь другой контент). Затем у вас есть контент в верхнем уровне (относительный) div как обычно. Дайте мне несколько минут, и я буду работать код уа ...
Хорошо сделали, что - попробуйте следующее:
.transparent {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
}
.opaque {
position: relative;
}
.content {
position: absolute;
left: 10px;
top: 10px;
}
<div class="opaque">
<div class="transparent">
<img src="/Images/header1.png"/>
</div>
<div class="content">
Hello world!
</div>
</div>
К сожалению, я не могу найти способ, чтобы поместить относительный элемент над прозрачным дела. Если кто-то найдет способ, пожалуйста, вставьте код здесь. Кстати, на самом деле нет необходимости указывать какие-либо z-индексы.
CSS RGBA
http://www.css3.info/preview/rgba/ http://www.css3.info/preview/opacity/
Работает ли это в IE 6,7,8 ?? – dododedodonl
№. Для IE7 + вы можете использовать прозрачный (1x1) PNG в качестве резервной копии в условной таблице стилей. Для IE6, просто неважно об этом, если вы не создаете сайт для Китая или Индии. – Dave
Я также столкнулся с проблемами наследования с прозрачностью некоторое время назад, это сделал трюк для меня: http://blog.ninanet.com/2010/04/27/css-transparency-inheritance-hack (demo).
Возможно, вы также можете опубликовать правила CSS для '.transparent' и' .notTransparent'? –
Просто уточнить; разве у вас нет своего тега 'div' назад? Вы говорите о наличии прозрачного снаружи, но непрозрачного внутри, не так ли? –
@ Андрю Парикмахер: я думаю, что divs - правильный путь - я думаю, что dododedodonl (я заслуживаю рейтинга только для написания этого права!) Заключается в том, что они хотят, чтобы слово «контент» непрозрачно, но div позади этого быть слегка прозрачным. Таким образом, за словом «контент» может быть помещен слегка выцветший фон. Однако слово должно быть в собственном div, как в моем ответе. В результате, что ничего за внешней панелью не было видно, что-либо внутри прозрачного div было бы слегка выцветано, а что-либо вне его было бы полностью непрозрачным. – ClarkeyBoy