Как исправить багги webkit-text-size-adjust на iOS5 и iOS6?

Я получаю неправильную высоту строки при использовании свойства -webkit-text-size-adjust CSS в UIWebView под iOS 5 и iOS 6. Кажется, что ошибка в iOS 5, а также в iOS 6, но поведение отличается, и я пытаясь исправить презентацию, чтобы она работала во всех версиях IOS.

То, что я пытаюсь достичь: загружаю следующий HTML-код в UIWebView. Код просто устанавливает размер шрифта, высоту строки и настройку размера текста для всего текста.

 <html><head>
 <style language="text/css">
 body {
 -webkit-text-size-adjust : 50%;
 }
 p {
   font-size: 2em;
   line-height: 3em;
  /* line-height: 150%; */  
 }
 </style>
 </head><body>
 <p>Text text text... </p>
 </body>

Значение 50% атрибута -webkit-text-size-adjust должно уменьшать (на 50%) размер всего текста. Имеет смысл одновременно уменьшить размер шрифта и высоту линии, иначе текст будет выглядеть довольно уродливым. Теперь кажется, что ни iOS 5.1, ни iOS 6 не делают этого последовательно. (В моем приложении я должен использовать атрибут -webkit-text-size-adjust, потому что пользователь должен иметь возможность изменять размер текста.)

Поведение iOS 5.1 заключается в уменьшении размера шрифта; высота линии остается равной одному значению. Поэтому iOS 5.1 интерпретирует вышеуказанный HTML, как будто я написал font-size: 1em; line-height: 3em;. UIWebView на iOS 5.1 покажет небольшой текст с огромными промежутками между строками.

Решение для iOS 5.1 состояло в том, чтобы написать line-height: 150%;, а не line-height: 3em. Затем iOS 5.1 сохранил значение line-height без изменений на 150%, а размер шрифта был уменьшен. Поэтому текстовое отображение было правильным.

Поведение iOS 6.0, как следует из моих тестов, заключается в уменьшении как размера шрифта, так и значений высоты строки, даже если значение высоты строки указано в процентах. (Кажется, это ошибка). Поэтому iOS 6.0 отобразит этот текст так, как будто я написал font-size: 1em; line-height: 75%;. В результате высота линии вычисляется как 75% от размера шрифта, т.е. Строки текста настолько близки друг к другу, что они почти перекрываются.

Решение на iOS 6.0 должно написать line-height: 3em;. Но это не будет работать на iOS 5.1.

Я не думаю, что есть атрибут CSS, который чувствителен к версии iOS... Как я могу заставить приложение работать на обеих версиях iOS?

Ответ 1

Вы пробовали установить его так: { line-height:1.5 }. Он равен 3 с шрифтом 2em, но указывает устройству визуализировать высоту линии в 1,5 раза больше, чем шрифт, а не жестко закодированное значение em.

РЕДАКТИРОВАТЬ: до сих пор не считают ошибкой. Я не думаю, что вы говорите CSS достаточно, прежде чем стрелять в настройку размера.

Следующий код выглядит идентично между iOS 5.1 и 6.0:

html { font-size:40px }
body {
font-size:0.5em; /* without this.. */
-webkit-text-size-adjust : auto; /* 50% is arbitrary */
}
p {
  font-size: 2em;
  line-height: 1.5;
  margin-bottom:3em;
}


<p>Text text text...</p>
<p>Text text text...</p>
<p>Text text text...</p>
<p>Text text text...</p>

Ответ 2

Что касается вашей проблемы, я решил очень-очень уродливо решить проблему:

При запуске я получаю версию iOS, и я сохраняю ее в своей части приложения. Затем, когда мне нужно работать иначе, чем я, и

if(osVersion < 5){
// iOS 4.3 properly working code here
}
else if (osVersion < 6){
// iOS 5.0 and 5.1 properly working code here
}
else{
// iOS 6 properly working code here.
}