Какой стиль CSS мне нужно установить для непрозрачности при печати из Internet Explorer 8? - PullRequest
5 голосов
/ 21 декабря 2011

Я сделал веб-страницу, которая состоит из двух перекрывающихся изображений. Я применил фильтр непрозрачности к верхнему изображению, чтобы оба изображения были читабельными. Непрозрачность является правильной на экране для большинства браузеров, включая IE и Firefox. Однако, когда я печатаю страницу на реальном принтере или на принтере PDF из IE версии 7 или 8, печатается только верхнее изображение. Верхнее изображение правильно просвечивает при печати из IE 9 и Firefox.

Ниже приведен код моей веб-страницы.

<html>
<body>
<DIV style="POSITION: absolute; WIDTH: 366px; HEIGHT: 439px; TOP: 100px; LEFT: 100px; Z-INDEX: 1;">
    <IMG style="POSITION: relative; WIDTH: 366px; HEIGHT: 439px;" src="below_picture.png">
</DIV>
<DIV style="POSITION: absolute; WIDTH: 366px; HEIGHT: 439px; TOP: 100px; LEFT: 100px; Z-INDEX: 390;">
    <IMG style="POSITION: relative; WIDTH: 366px; HEIGHT: 439px; FILTER: alpha(opacity=75);" src="above_picture.png">
</DIV>
</body>
</html>

Какой стиль CSS мне нужно установить для непрозрачности при печати из Internet Explorer 8?

Ответы [ 4 ]

6 голосов
/ 18 июня 2013

Попробуйте, это даст эффект размытия во всех основных браузерах, включая

.CLASS_NAME {
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

  /* IE 5-7 */
  filter: alpha(opacity=50);

  /* Netscape */
  -moz-opacity: 0.5;

  /* Safari 1.x */
  -khtml-opacity: 0.5;

  /* other intelligent browsers */
  opacity: 0.5;
}
4 голосов
/ 17 июня 2013

Я должен сказать, что это встроенная проблема IE, поскольку эти версии не поддерживают непрозрачность напрямую,

ссылаются ссылка

Теперь, как вы можете видеть, непрозрачностьне поддерживается IE7-8 напрямую, вы можете использовать фильтры с условным кодом CSS

Код ссылка

.opaque2 {  // for IE5-7

    filter: alpha(opacity=50);
}

или для IE8

-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

порядоксодержимое должно быть

.opaque {
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; // first!
    filter: alpha(opacity=50);                  // second!
}

За исключением того, что вы можете использовать css3pie с одним htc-файлом, который поможет вам добавить правила css3 почти во все не поддерживающие браузеры ..

Я надеюсь, что это поможет ..

1 голос
/ 19 июня 2013

IE8 использует свойство -ms-filter.

старше IE нужно filter: alpha(opacity=XX)

img.namedClass {
    position: relative;
    width: 366px;
    height: 439px;

    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: alpha(opacity=75);
    opacity: 0.75;
}

это, на каскаде, должно решить проблему для всех текущих браузеров

0 голосов
/ 13 июня 2013

Я думаю, что ошибка заключается в позиционировании. Вы используете абсолютную позицию на родительском элементе div, в то время как ваш дочерний элемент находится на позиции: ..cheers ..

...