Прозрачность для всех браузеров

lena1

クリエイター
LV
0
 
Как помним, прозрачность (transparency) - это одна из тех вещей, которая отображается во всех браузерах по-разному. К счастью, чтобы избавиться от данного бага, нам будет достаточно прописать пару строк в CSS (в примере используется прозрачность в 50%)

<!--c1--><div class='codetop'>Код</div><div class='codemain'><!--ec1-->.transparency_class {
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;filter:alpha(opacity=50);
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-moz-opacity:0.5;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;opacity: 0.5;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}<!--c2--></div><!--ec2-->

<u>О каждом параметре по порядку:</u>

<b>opacity: 0.5;</b> - задает прозрачность для Firefox, Safari и Opera. Если бы все браузеры поддерживали стандарты, то мы вполне могли бы обойтись одной этой строкой, но увы… посему идем дальше

<b>filter:alpha(opacity=50);</b> - установка прозрачности в IE

<b>-moz-opacity:0.5;</b> - поддерживает прозрачность в старых версиях Mozilla

<u>Вот пару идей по поводу того, для чего нам это может пригодиться:</u>

1. Использовать прозрачность для счетчиков в “подвале”, чтобы те не сильно привлекали внимание

2.Использовать прозрачность для фотогалерей, прописав к картинкам-ссылкам параметр a:hover. Таким образом мы получим дополнительную “анимацию” без использования flash, а значит не возникнет каких-либо проблем с индексацией, и страница не будет перегружена.
 
Сверху