72pt:
—あ
96px:
—あ
1in
—あ
141px:*1
—あ
227px:*2
—あ
128px:*3
—あ
Retinaディスプレイ - らんだむな記憶で計算したように手持ちのWindows機のディスプレイは物理インチあたり141pixelであったので、141pxのフォントサイズで指定して、画面解像度を1920x1080のデスクトップの表示サイズを100%にする、つまりドットバイドットにすると、EMダッシュが確かに横幅254mm、つまり1物理インチになっていた。
MacについてはMacBook Pro 2016はディスプレイのデフォルト解像度が変更されている | IT Strikeを見るとデフォルトの解像度が1440×900になっているらしいので、227px指定の場合に1物理インチの2560/1440倍、つまり1.78物理インチ=452mmくらいになっているだろうと思い定規で計測すると大体そのようになっていた。1物理インチ相当にしたい場合、227*1440/2560=128pxくらいで大体254mmで表示されるだろうし、実際そうなっていた。
CSS - CSSでpx以外の絶対単位はどのようなときに使うのでしょうか。(64420)｜teratailにも説明が記載されていた。pxは視覚角度単位(visual angle unit)という呼び方なのか・・・
CSS Values and Units Module Level 3 日本語訳の内容からするとCSS3にては 1in = 72pt = 96px となっている。実際、上記でのサイズ指定で最初の3つは同じ大きさで表示されている。ここでより正確には1論理インチ = 72論理ポイント = 96論理ピクセルとして解釈するべきだろうということだ。ドットバイドットでない時には、これらは1物理インチたる254mmにはならない。
ドットバイドットでない場合、1論理ピクセルが1物理ピクセルと異なるので本当に頭の中がごちゃごちゃになる・・・。対角13.3インチRetinaのMacの場合、横に物理ピクセルが2560個存在し、デフォルトの解像度が1440×900であることから、1論理ピクセル=1.78物理ピクセルとなるということだ・・・🌀
【単位超入門】ピクセル、ドット、PPI、DPI、解像度、メートル、インチ、ポイントも参考になりそうだがキリがないな・・・
