0
これは、デスクトップビューとモバイルビューでフォントサイズをテストするためのコードです。 Chrome Inspectorを使用して、デスクトップビューとiphone5ビューを切り替えます。ChromeのiPhone5ビューのフォントサイズの変更
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>html5 font test</title>
<link rel="stylesheet" href="">
<style type="text/css">
body, html {
font-size: 18px;
}
p {
font-size: 1em;
}
</style>
</head>
<body>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer a arcu sed massa finibus dapibus ac sed erat. Phasellus eget magna lectus. Curabitur lectus augue, porta ac faucibus a, efficitur et mi. Phasellus id purus maximus sem placerat varius et luctus eros. Donec maximus odio at erat facilisis, id lacinia erat imperdiet. Cras lacinia orci sed nisl gravida vestibulum. Aliquam dignissim nisl ut auctor rhoncus. Nam congue, diam quis ultrices iaculis, mi purus mollis libero, sit amet egestas nulla justo vel dui. Ut pharetra bibendum lorem, eget rutrum mi scelerisque id. Nullam feugiat condimentum cursus. In at fringilla augue.</p>
</body>
</html>
pタグのfont-sizeはデスクトップでは18pxですが、iphone5ビューでは51pxに変更されています。ブラウザウィンドウの幅を調整すると、font-sizeは18pxのままですが、iPhone5ビューに切り替えると、font-sizeが51pxに変わります。
ここでここでフォントサイズ
を計算クロームiPhone5のモバイルビューは、デスクトップ計算し、フォントサイズ
どのようにこれが起こるんですか？
www.wordpress.comにアクセスすると、計算されたフォントサイズはChromeデバイスシミュレータで表示されたときに20pxから16pxに変更されます。どうして？
ありがとうございました！それは動作しますが、フォントサイズはiPhone5ビューでは18pxのままですが、デバイスの幅（320px）でレンダリングすると、計算されたフォントサイズが変更されません。 –
私はそれは、モバイルデバイスがデフォルトでモバイルフレンドリーではないウェブサイトを補うために、フォントのサイズを調整してテキストを見やすくするためだと思います。 – WizardCoder