-webkit-transform Свойства CSS Визуализация шрифтов шлангов

Question

Этот вопрос почти такой же, как , этот , за исключением того, что я вижу его исключительно в Safari на Mac (единственная платформа, о которой мне нужно заботиться).Это определенно связано с CSS, и я думаю, что я сузил его до нескольких свойств, которые, кажется, наносят ущерб способу отображения текста.Это:

-webkit-transform-style: preserve-3d;
-webkit-transform: rotateY(180deg);
-webkit-transform: rotateY(180deg);
-webkit-perspective: 2500;

Как только я отключу их (добавив к ним префикс "x", например, x-webkit-*), текст будет отображаться нормально.Включение любого одного из них приводит к потерянному тексту.Вот несколько скриншотов, которые могут помочь визуализировать разницу.

http://s3.amazonaws.com/codaset/ticket/6404/665/good.png http://s3.amazonaws.com/codaset/ticket/6404/666/bad.png

Кто-нибудь знает, что может быть причиной этого, и если / как это можетбыть исправленным?Google не очень помог.

Спасибо.

Answer 1

Я думаю, что это на самом деле можно исправить в более поздних версиях iOS (я считаю 3.2 и 4.0) с помощью -webkit-font-smoothing: antialiased.Примечание. Псевдоним по-прежнему будет другим, но он будет выглядеть неуклюже, если он анимирован.

Answer 2

Преобразования в Safari с аппаратным ускорением.Это обеспечивает гораздо лучшую скорость, но рендеринг не следует тому же конвейеру, и некоторое качество теряется.Вы ничего не можете с этим поделать, кроме как не использовать преобразования.: /

Answer 3

Сегодня сталкивался с этой проблемой и должен был использовать transform: scale(1.1) translate3d(0,0,0); (http://css -tricks.com / forums / topic / transforms-reason-font-smoothing-weirdness-in-webkit / ) для заставить его работать.