iOS 9 iPad hava text-gölge render eserler html ile

Question

şöyle:

<h1>Lorem ipsum Incididunt minim enim pariatur ex in irure Duis deserunt.</h1> 

Ve css:

h1 { 
    color: #fff; 
    font-size: 4em; 
    font-family: sans-serif; 
    text-shadow: 2px 2px 8px #000; 
} 

Ben iPad'de iOS 9.3.2 üzerinde render bazı garip gölge eserlerin alıyorum hava (1 ve 2). Sorun iPad mini 1 veya 2'de veya iOS 10.1'de tekrarlanamadı.

Yazı tipi, çizgi yüksekliği, gölge vb. Alfa saydamlığını değiştirmeyi denedim ... ve suçlu, herhangi bir metin gölgesini ham h1 öğesiyle (ve diğer öğeleri varsayarak) kullanıyor gibi görünüyor. Yazı tipi boyutu daha büyük olduğunda ve metin rengi beyaz olduğunda sorun daha kolay görünüyor, ancak metin gölgesi özelliği kesinlikle var (kesinlikle yakınlaştırmak için biraz daha yakınlaştırmanız gerekebilir).

Verilen ekran görüntüsünde yakalanan sorun oldukça küçüktür, ancak farklı metin/yazı tipi boyutları ile bazen çok daha kötüdür.

Kök neden hakkında bilgi sahibi olan var mı? Bunun hangi aygıtların/os sürümlerinin etkilediğini tam olarak bilen var mı? Herkes bu sorun için iyi bir çözümden haberi var mı?

jsfiddle: https://jsfiddle.net/t7ccn528/

Answer 1

h1 konumlandırılmış göreli veya mutlak yapmayı deneyin (bunun için çalışır hangisi ağacında yerleştirme biçimi). Sonra bir üst ekle: 0;

bağlantılar: H1 üzerinde font yumuşatma CSS özellikleri ile

Mess, özellikle alt piksel-kenar yumuşatma. Bu ikisini ayrı ayrı ve birlikte deneyin. Aksi takdirde, Browserstack VM'imde kopyalayamıyorum, muhtemelen bunu çözebilirdim.