cssでfont-size に pxとrem 両方を併用して記述する意味 | クズリーマンのカス備忘録

cssでfont-size に pxとrem 両方を併用して記述する意味

css-logo css
スポンサーリンク

社内の他の人が作ったcssファイルの中で(DWとかで自動でできたものかもだけど)、font-size に pxとrem 両方を併用して記述してるのがあった。

 

以下みたいなこと。

body {
  font-size: 34px;
  font-size: 3.4rem;
}

 

これをやる意味。の仮説

 

えーと、上から解釈されるから、

まず、

  1. pxが読み込まれて
  2. その次にremが読み込まれるので、
  3. 先に読み込まれたpxは無効になって、
  4. 後から読み込まれたremだけ有効になる?

 

これをやる意味。結論

↑の仮説、半分正解。

メジャーなブラウザ(remに対応してる)なら、そうなる。

対応ブラウザ一覧は can i use

に載ってる。

 

remに対応してないブラウザは、remが読み込まれないので、pxで設定した値が適用される。

対応してないブラウザ例:

  • IE8
  • 独自ブラウザ
    • 音声ブラウザなど

ほとんど無視していいケースが多そうに思う。

参考にしたサイト

ideahacker.net - ideahacker リソースおよび情報
ideahacker.net は、あなたがお探しの情報の全ての最新かつ最適なソースです。一般トピックからここから検索できる内容は、ideahacker.netが全てとなります。あなたがお探しの内容が見つかることを願っています!

 

 

 

 

 

コメント

タイトルとURLをコピーしました