С html следующим образом:
<h1>Lorem ipsum Incididunt minim enim pariatur ex in irure Duis deserunt.</h1>
И css:
h1 {
color: #fff;
font-size: 4em;
font-family: sans-serif;
text-shadow: 2px 2px 8px #000;
}
Я получаю некоторые нечетные теневые артефакты в рендеринге на iOS 9.3.2 на iPad (1 и 2). Проблема не была воспроизведена на iPad mini 1 или 2 или на iOS 10.1.
Я экспериментировал с изменением шрифта, высоты строки, альфа-прозрачности в тени и т.д.... и преступник, кажется, просто использует любую тень текста с сырым элементом h1 (и я принимаю другие элементы). Кажется, что проблема легче воспроизвести, когда размер шрифта больше, а цвет текста белый, но определенно существует только свойство теневого тэга (возможно, потребуется немного увеличить масштаб и уменьшить его, чтобы воссоздать его).
Проблема, зафиксированная на снимке экрана, довольно незначительна, но с разными размерами текста и шрифта иногда бывает намного хуже.
Есть ли у кого-нибудь информация о первопричине? Кто-нибудь знает, что именно влияет на версии устройств /os? Кто-нибудь знает какие-либо хорошие способы решения проблемы?
jsfiddle: https://jsfiddle.net/t7ccn528/
Попробуйте сделать позицию h1 равной или абсолютной (какая из них подходит для ее размещения в дереве). Затем добавьте верх: 0;
Также попробуйте:
Погрузитесь с CSS-свойствами, сглаживающими шрифты, на H1, особенно подпиксельно-сглаженные. Попробуйте эти два отдельно и вместе. Я не могу реплицировать свою VM-браузеру, иначе я мог бы это выяснить.