VPF::Прозрачность изображнения - Форум программистов

OutlawZ

Дата 15.10.2009, 16:01 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Awaiting Authorisation
Сообщений: 269
Регистрация: 19.10.2007

Репутация: нет
Всего: нет

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

Код


......
<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 (ссылка)

(нет голосов)

Загрузка ...

прапор творюет

Награды: 1

Профиль
Группа: Завсегдатай
Сообщений: 12022
Регистрация: 5.12.2007
Где: Königsberg

Репутация: 50
Всего: 315

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

OutlawZ

Дата 15.10.2009, 16:24 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Awaiting Authorisation
Сообщений: 269
Регистрация: 19.10.2007

Репутация: нет
Всего: нет

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

--------------------

NLspieler

Дата 15.10.2009, 19:16 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 619
Регистрация: 13.10.2008
Где: Берлин

Репутация: нет
Всего: 19

Цитата(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>

Это сообщение отредактировал(а) NLspieler - 15.10.2009, 19:17

OutlawZ

Дата 15.10.2009, 19:30 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Awaiting Authorisation
Сообщений: 269
Регистрация: 19.10.2007

Репутация: нет
Всего: нет

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

--------------------

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »