Полупрозрачный блок, но непрозрачное содержимое.

Как сделать так, чтобы содержимое блока div не наследовало прозрачность самого div-а?
/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .html4strict.geshi_code {font-family:monospace;} .html4strict.geshi_code .imp {font-weight: bold; color: red;} .html4strict.geshi_code .kw2 {color: #000000; font-weight: bold;} .html4strict.geshi_code .kw3 {color: #000066;} .html4strict.geshi_code .es0 {color: #000099; font-weight: bold;} .html4strict.geshi_code .br0 {color: #66cc66;} .html4strict.geshi_code .sy0 {color: #66cc66;} .html4strict.geshi_code .st0 {color: #ff0000;} .html4strict.geshi_code .nu0 {color: #cc66cc;} .html4strict.geshi_code .sc-1 {color: #808080; font-style: italic;} .html4strict.geshi_code .sc0 {color: #00bbdd;} .html4strict.geshi_code .sc1 {color: #ddbb00;} .html4strict.geshi_code .sc2 {color: #009900;} .html4strict.geshi_code span.xtra { display:block; }

<div>
<img src="/images/pic.jpg">
</div>
 

Свойства css:
/** * GeSHi (C) 2004 - 2007 Nigel McNie, 2007 - 2008 Benny Baumann * (http://qbnz.com/highlighter/ and http://geshi.org/) */ .css.geshi_code {font-family:monospace;} .css.geshi_code .imp {font-weight: bold; color: red;} .css.geshi_code .kw1 {color: #000000; font-weight: bold;} .css.geshi_code .kw2 {color: #993333;} .css.geshi_code .co1 {color: #a1a100;} .css.geshi_code .co2 {color: #ff0000; font-style: italic;} .css.geshi_code .coMULTI {color: #808080; font-style: italic;} .css.geshi_code .es0 {color: #000099; font-weight: bold;} .css.geshi_code .br0 {color: #00AA00;} .css.geshi_code .sy0 {color: #00AA00;} .css.geshi_code .st0 {color: #ff0000;} .css.geshi_code .nu0 {color: #cc66cc;} .css.geshi_code .re0 {color: #cc00cc;} .css.geshi_code .re1 {color: #6666ff;} .css.geshi_code .re2 {color: #3333ff;} .css.geshi_code .re3 {color: #933;} .css.geshi_code span.xtra { display:block; }

width: 100px;
height: 100px;
opacity: 0.6;
background-color: black;
 
0
css html верстка

1 ответов

opacity: 0.6;
background-color: black;
background-color: rgba(0, 0, 0, 0.6);
2

Попробуйте сделать фон основного дива прозрачным изображением png нужного цвета, размером, к примеру, в 1px и сделайте для него repeat. Тогда блок станет визуально прозрачным, а содержимое - нет.

0

1. применить правильный селектор.
2. Может использовать rgba для background-a

0

Боюсь, что это будет не валидно в других браузерах. Сделал у обоих div-ов position: absolute. Только первый сделал прозрачным. Теперь все, что находится во втором div-е, не прозрачное. Проверял, работает даже в IE7.

0