Отрисовка текста в IE с градиентом

IE 8 и более ранние версии ужасно отображают текст, если он находится над любым элементом, к которому применен «фильтр». В этом нет ничего удивительного. Обычно я просто избегаю использования «фильтра». Тем не менее, я проводил некоторые тесты в IE9 и заметил ОГРОМНУЮ проблему; текст, отображаемый поверх любого элемента с применением градиента css3 или тени блока, рендеринг текста уничтожается. Не только для текста непосредственно поверх элемента, но и для каждого элемента, который выше градиента в z-индексе. Например, если я определяю фон своей страницы с помощью градиента, покрываю его сплошным белым элементом div, а затем отображаю текст поверх него, это все равно ужасно. Я очень надеюсь, что это просто бета-проблема, которая будет решена в финальном релизе. Я использовал код здесь для градиентов некоторое время ( минус фильтр), но теперь в IE9 все страницы, использующие эту технику, выглядят ужасно. Кто-нибудь знает что-нибудь об этом? Я ничего не нашел об этой проблеме, когда гуглил.


filter css internet-explorer internet-explorer-9 text-rendering
person Jo Sprague    schedule 21.12.2010    source источник
comment
Microsoft довольно придирчиво относится к конфиденциальности своих списков ошибок, особенно для бета-проектов. При этом я еще ничего не видел, но только релиз ответит на вопрос.   -  person PseudoNinja    schedule 21.12.2010
comment
Скрещу пальцы Я ненавижу, когда я создаю сайт, который должен быть классным, а клиент смотрит на него в IE и спрашивает, почему рендеринг текста отстой. Я хотел бы обвинить в этом IE в тот момент, но для клиента это никогда не имеет значения.   -  person Jo Sprague    schedule 24.12.2010
comment
Посмотрите, что: stackoverflow .com/questions/9156731/ и stackoverflow.com/questions/2503920/   -  person    schedule 27.03.2014
comment
Консенсус - это изящная деградация - используйте сплошной цвет для старого IE или фонового изображения - пусть новый IE получит новый (выходной) блеск.   -  person Ruskin    schedule 18.06.2014
comment
возможный дубликат IE создает странное подчеркивание значка шрифта   -  person Paul Sweatte    schedule 20.06.2014
comment
Я согласен с Раскиным. Я бы посоветовал использовать изображение шириной 1 пиксель с градиентом и выполнить background-repeat: repeat-x; в теме.   -  person cpk    schedule 09.08.2014

Ответы (2)


arrow_upward
0
arrow_downward

Демо для IE: -

http://samples.msdn.microsoft.com/workshop/samples/author/filter/gradient.htm

Синтаксис HTML

<ELEMENT STYLE=
"filter:progid:DXImageTransform.Microsoft.Gradient(sProperties)" ... >

Internet Explorer 5.5 или более поздней версии Пример: -

<DIV STYLE="width:100%; filter:
    progid:DXImageTransform.Microsoft.MotionBlur(strength=13, direction=310)
    progid:DXImageTransform.Microsoft.Blur(pixelradius=2)
    progid:DXImageTransform.Microsoft.Wheel(duration=3);">
        Blurry text with smudge of gray.</div>

Включен логический атрибут, для которого можно установить false или true http://msdn.microsoft.com/en-us/library/ms532997%28v=vs.85%29.aspx

Градиенты CSS в IE7 и IE8 приводят к тому, что текст стать псевдонимом

Пример:

-ms-filter: "progid:DXImageTransform.Microsoft.gradient(enabled=false)";
person Mohit Kumar Gupta    schedule 04.12.2014

arrow_upward
0
arrow_downward

Четыре года спустя я думаю, что можно с уверенностью сказать, что это была бета-проблема.

При открытии примера в IE 8 заметных проблем нет, за исключением всегда плохого сглаживания в IE 8 на таких платформах, как Windows XP.

Многое изменилось.

person xaddict    schedule 22.04.2015