Webkit против Firefox против Opera, проблема с тенью текста - PullRequest
3 голосов
/ 08 февраля 2012

Кажется, у меня проблема с тем, что Firefox отображает размытую тень текста с непрозрачностью 0,75 на белом фоне, но в Webkit и Opera он слишком темный / четкий. Кто прав? Что дает? И как мне попытаться это решить? Спасибо.

Примечания:

Вот пример JSFiddle

На самом деле, похоже, проблема в выборе фильтра обработки изображения. Версия Fire Fox выглядит более размытой, затем следует Opera, а затем Chrome / Safari (Webkit). Похоже, что браузеры Webkit используют какой-то блочный фильтр для размытия, тогда как Firefox использует что-то более плавное. Тень в Webkit кажется слишком четкой.

Ответы [ 2 ]

3 голосов
/ 08 февраля 2012

Если я понял вашу проблему, чтобы исправить ее в Chrome и Opera, вы должны установить радиус размытия на более высокое значение, чтобы получить одинаковый результат в этих трех браузерах. Я знаю это, потому что я использую box-shadow в Firefox и Chrome, и я заметил это.

проверьте этот живой пример: http://css3generator.com/

firefox: текстовая тень: 1px 10px 19px # 050505; хром и опера: 1px 10px 29px # 050505;

0 голосов
/ 08 февраля 2012

Глядя на http://www.w3.org/TR/css3-text/#changes (рабочий проект W3C 19 января 2012 г.)

Ряд менее стабильных функций был отложен до уровня 4: ...

...

  • радиус разброса по текстовой тени

Значит, значение не было указано. Пойди разберись.

В любом случае, я также (повторно) обнаружил, что text-shadow принимает список с разделителями-запятыми, поэтому я полагаю, что если бы я хотел еще больше размыть его вручную, если у меня изначально было

    text-shadow: 5px 5px 5px rgba(0, 0, 0, 0.75);

Я мог бы сделать что-то вроде

 text-shadow: 4px 4px 5px rgba(0, 0, 0, 0.1875),
   4px 6px 5px rgba(0, 0, 0, 0.1875),
   6px 4px 5px rgba(0, 0, 0, 0.1875),
   6px 6px 5px rgba(0, 0, 0, 0.1875);

добавляя тени по мере необходимости.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...