Прозрачность — это одно из тех свойств CSS, которое имеет странную историю и требует множества различных свойств и значений, чтобы обеспечить кросс-браузерную прозрачность совместимости, которая восходит как можно дальше. Чтобы охватить все ваши основы, вам нужно несколько CSS-операторов. К счастью, они не мешают друг другу, поэтому их использование каждый раз, когда вы хотите добавить прозрачность, не доставляет особых хлопот и беспокойств. Вот они, и в настоящее время установлены прозрачность 50%:
Только CSS Показать элементы
/* CSS Class to show elements */
.show {
/* Required for IE 5, 6, 7 */
/* ...or something to trigger hasLayout, like zoom: 1; */
width: 100%;
/* Theoretically for IE 8 & 9 (more valid) */
/* ...but not required as filter works too */
/* should come BEFORE filter */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
/* This works in IE 8 & 9 too */
/* ... but also 5, 6, 7 */
filter: alpha(opacity=100);
/* Older than Firefox 1.0 */
-moz-opacity:1.0;
/* Safari 1.x (pre WebKit!) */
-khtml-opacity: 1.0;
/* Modern!
/* Firefox 0.9+, Safari 2?, Chrome any?
/* Opera 9+, IE 9+ */
opacity: 1.0;
}CSS Only Hide Elements
/* CSS Class to hide elements */
.hide {
/* Required for IE 5, 6, 7 */
/* ...or something to trigger hasLayout, like zoom: 1; */
width: 0%;
/* Theoretically for IE 8 & 9 (more valid) */
/* ...but not required as filter works too */
/* should come BEFORE filter */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
/* This works in IE 8 & 9 too */
/* ... but also 5, 6, 7 */
filter: alpha(opacity=0);
/* Older than Firefox 1.0 */
-moz-opacity:0;
/* Safari 1.x (pre WebKit!) */
-khtml-opacity: 0;
/* Modern!
/* Firefox 0.9+, Safari 2?, Chrome any?
/* Opera 9+, IE 9+ */
opacity: 0;
}