Прозрачный div IE 8 с содержимым сверху

#css #html #internet-explorer-8 #render #letters

#css #HTML #internet-explorer-8 #визуализация #буквы

Вопрос:

Привет всем, в настоящее время у меня возникли некоторые проблемы с IE < 9 и отображением прозрачности. У меня есть прозрачный div и некоторый текст поверх него. он отлично смотрится в Firefox Chrome и IE 9. однако более старые версии IE отображают текст не так хорошо, как другие браузеры. Он читаем, но буквы имеют какое-то странное сглаживание по краям…

это веб-сайт ->http://jmia-js.saude.azores.gov.pt

если вы посетите его, например, с помощью IE8, вы поймете, что я имею в виду. или вы можете даже использовать IE net renderer для рендеринга сайта в браузере IE8.

кто-нибудь знает, как устранить эту незначительную ошибку? Огромное спасибо!

1. я пробовал с IE 9, 8 и 7 … я не могу найти проблему … можете ли вы более конкретно рассказать о блоке, у которого возникли проблемы?

2. Текст XXXVII и текст под ним выглядят странно в IE8 и 7. Я просто устал от IE6, и все выглядит нормально, хотя страница не отображается на 100% точно, но это другая проблема

Ответ №1:

Похоже, проблема вызвана атрибутом CSS filter, который вы используете для получения прозрачности в IE. Попробуйте вместо этого использовать прозрачный PNG в качестве фона, и ваш тип должен быть правильно сглажен.

1. хорошая идея. Я попробую это, как только смогу. вы знаете, работает ли это решение с большинством браузеров? Спасибо!

2. Ренато, PNG должен работать для IE7 , Firefox, Safari, Chrome, Opera и т.д. IE6 не поддерживает PNG-24 с полной альфа-версией, поэтому в этом случае вам нужно будет сделать исключение.

Ответ №2:

В старых версиях IE был альтернативный способ считывания непрозрачности. Попробуйте добавить эту строку:

 .opaque {
    opacity: 1;
    filter: alpha(opacity = 100);
}

1. Я уже использую этот подход. Код для прозрачных divs: .transparent{ /* Good browsers */ opacity: 0.6; /* IE 8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE 5-7 */ filter: alpha(opacity=60); /* Netscape */ -moz-opacity: 0.6; /* Safari 1.x */ -khtml-opacity: 0.6; } РЕДАКТИРОВАТЬ: я не могу понять, как правильно отображать код …. lol