они не работают в браузере iPhone

Question

Я настроил свои шрифты специально следующим образом:

* {font-size: 1em;}
html {font-size: 125%;}
body{font-size: 50%;}
p, ul, ol{line-height:1.7em; font-size:1.2em; margin-bottom:0.5em; }

Прекрасно работает на настольных браузерах и iPad (просмотр идентичен) - однако размер шрифта на iphone не уменьшается

Что я делаю не так?

Answer 1

Есть несколько решений вашей проблемы. Либо примените свойство text-size-adjust, специфичное для WebKit:

html {
  /* Prevent WebKit-based browsers from resizing the text: */
  -webkit-text-size-adjust: none;
}

Или вы можете определить ширину области просмотра в вашем HTML:

<meta name="viewport" content="width=device-width">

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