Прозрачность фона

[inokentik 45]

Нашел как сделать, чтобы был прозрачным фон ну или кусок того, что мне надо... Но столкнулс с небольшой проблемой и не знаю как решить... Может кто подскажет?

Вот у меня есть кусок например на сайте:

Серый фон с рамочкой задан классом BLOCK, для которого я собственно и прописываю параметры прозрачности, но получается что становится прозрачным ВЕСЬ блок, даже аватарки, которые на нем и вся информация... Как вообще грамотней и правильней сделать чтоб прозрачность была только для фона, а не для содержимого ячейки?!

[Critical Error 155]

background: transparent;

[inokentik 45]

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

<td width="346" class="block" align="center">

<table width="100%" border="0" cellspacing="0" cellpadding="0">

<tr><td>&nbsp;&nbsp;&nbsp;</td><td><div class="clock">{clock}</div></td></tr>

</table>

</td>

Для класса block задан параметр

.block {border:1px solid #ffffff; background-color: #000000;

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5+*/ 

-moz-opacity: 0.5; /* Mozilla 1.6 и ниже */ 

-khtml-opacity: 0.5; /* Konqueror 3.1, Safari 1.1 */ 

opacity: 0.5; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9+ */ 

zoom: 1; /* для элемента в ИЕ, у которого не заданы width и height */ 

}

А класс clock вот такой

.clock {font-size: 56px;  font-family: tahoma; text-decoration:none;}

И вот куда что вписать, чтобы текст из класса clock был не прозрачным вместе с фоном??

[Critical Error 155]

.block {border:1px solid #ffffff; background-color: #000000;

filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); /* IE 5.5+*/ 

-moz-opacity: 0.5; /* Mozilla 1.6 и ниже */ 

-khtml-opacity: 0.5; /* Konqueror 3.1, Safari 1.1 */ 

opacity: 0.5; /* CSS3 - Mozilla 1.7b +, Firefox 0.9 +, Safari 1.2+, Opera 9+ */ 

zoom: 1; /* для элемента в ИЕ, у которого не заданы width и height */ 

}

замени на:

.block {border:1px solid #ffffff; background-color: transparent;

zoom: 1; /* для элемента в ИЕ, у которого не заданы width и height */ 

}

Изменено 19 апреля 2011 пользователем Critical Error

[inokentik 45]

Это ничего не дало! Блок вместо полупрозрачного стал совсем прозрачным, то есть тупо цвет вырезали и все, вот и весь эффект...

Вот как у меня сейчас показывает:

Хочу сделать вот так, но чтоб текст был не прозрачным!!!

А с вашим советом получилось вот так:

Вы наверное что то не то говорите или не совсем понимаете, что я хочу сделать!!!

[WWW.ZEOS.IN 1 161]

http://htmlbook.ru/metki/prozrachnost

[Critical Error 155]

как вариант можешь сделать png файл в 1 пиксель нужного цвета.

и подключить

.block {border:1px solid #ffffff; background: url('/image.png') repeat;

zoom: 1; /* для элемента в ИЕ, у которого не заданы width и height */ 

}

Он будет повторятся и по вертикали и по горизонтали еще один вариант

.block {border:1px solid #ffffff; background-color: rgba(0,0,0,0.5);

zoom: 1; /* для элемента в ИЕ, у которого не заданы width и height */ 

}

но такое не будет работать в IE до 9 версии

в подписи сайт мой, там у блока сделано прозрачность по первому варианту из поста

http://htmlbook.ru/metki/prozrachnost

opacity делает все прозрачным. и дочерние элементы

хотя можно для класса clock сбросить этот opacity

Изменено 20 апреля 2011 пользователем Critical Error

[WebSet 74]

inokentik,

не проще ли через фотошоп сделать 1px картинку полупрозначной и сделать ее как фон?

[Critical Error 155]

не проще ли через фотошоп сделать 1px картинку полупрозначной и сделать ее как фон?

О_о

[WWW.ZEOS.IN 1 161]

WebSet,

Я тоже так делаю всегда, но браузер IE в некоторых версиях не поддерживает прозрачности PNG

[Critical Error 155]

браузер IE в некоторых версиях не поддерживает прозрачности PNG

как ни странно, у меня во всех работает.

к тому же есть фиксы для прозрачности.

[inokentik 45]

inokentik,

не проще ли через фотошоп сделать 1px картинку полупрозначной и сделать ее как фон?

Не думал об этом, попробую)

Ну да, спасибо, тему можно закрывать, сделал рисунком в 1 пиксель, отлично получилсоь по моему!