top / パソコン / ホームページの作り方  スマホページを作る (6)ブラウザ別の対応が必要  2024/8 　ウェブサイトの見え方は、ブラウザによって微妙に異なるので、ブラウザ別の対応が必要となります。 　日本におけるスマホブラウザのシェアは、SafariとChromeが拮抗しています（Mobile Browser Market Share Japan | Statcounter Global Stats）。したがって、この2つへの対応に重点を置くことになります。 　デスクトップのブラウザは、Chromeが65％を占め、Edgeが20％、FirefoxとSafariが5%となっています（Desktop Browser Market Share Japan | Statcounter Global Stats）。windowsのブラウザが9割以上を占めていて、いずれも正常に表示されているので、特に対策は必要ないと思われます。中古のiPhone8を持っていますが、Macのデスクトップは持っていないので、デスクトップのSafariがどう見えているのか確認できません。iPhone8のSafariで問題がなければ良いかなと思います。 　スマホのChromeでは行間が少し狭かったので、次のようにスタイルシートで行間幅を指定しました。 <style> body { line-height: 150%; } </style> 　しかし、この指定はテーブル内には及ばないようなので、セル内に次のように行間を指定しました。 <style> td { line-height: 150%; } </style> 　ウェブページのフォントはメイリオで指定しています。ところが、Safariでは明朝になってしまうので、CSSで次のように指定しました。 body {  font-family:"メイリオ", sans-serif;  }　 　ところ効果がないようなので、HTML本文に次のタグを挿入しました。すると、ゴチックで表示されるようになりました。 <p style="FONT-FAMILY: メイリオ, sans-serif" >　 　フォント指定の方法や効果は、ブラウザごとに異なるので、試行錯誤で試してみるほかないようです。