Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Прозрачность изображнения

Автор: OutlawZ 15.10.2009, 16:01

Привет всем, столкнулся с такой проблемой, она заключается в том что когда я делаю прозрачную картинку для ячейки таблицы то текст по верх нее становиться то же прозрачным:

Код


......
<style>
 .target
  {
     background-image: url("images/test.jpg");
     filter:alpha(opacity=6); 
    -moz-opacity: 0.1;
    -khtml-opacity: 0.1; 
    opacity: 0.1; 
  }
</style>
.......
<table border="0" cellpading="0" cellspacing="0">
    <td class="target">текст по верх картинки</td>
</table>

Хотя это логично потому что я задаю прозрачность для для самой ячейки, только вот вопрос как можно сделать так что бы фон был прозрачным а текст на нем отображался нормально. Видел много сайтов где фон прозрачный т.е сливается с фоном сайта а текст на нем отображается как надо, есть какой нить способ добиться этого????
Может надо использовать AlphaImageLoaded???????????

Автор: bars80080 15.10.2009, 16:06

чаще всего это делается за счёт двух разных блоков, которые идут друг за другом по коду, но не вложены один в другой. один с фоном, другой с текстом сверху, position: absolute
фон делается прозрачным, а второй блок нет

Автор: OutlawZ 15.10.2009, 16:24

Если можно небольшой пример то буду очень благодарен!

Автор: NLspieler 15.10.2009, 19:16

Цитата(OutlawZ @ 15.10.2009, 16:24

)

Если можно небольшой пример то буду очень благодарен!

Код


<style>
.prosr
{
    background-image: url("images/test.jpg");
    filter:alpha(opacity=6); 
    -moz-opacity: 0.1;
    -khtml-opacity: 0.1; 
    opacity: 0.1;
    height: 200px;
    width: 200px;
    position: absolute;     
    top: 0px;
    left: 0px;
}
.text
{
    height: 200px;
    width: 200px;
    position: absolute;     
    top: 0px;
    left: 0px;
}
</style>


<body>
<div class="prosr"></div>
<div class="text">Тут текст</div>
</body>

Автор: OutlawZ 15.10.2009, 19:30

Спасибо большое