CSS pixel

CSS Pixel —CSS で接尾辞 px とともに示されます— は、人間の目で負担なく快適に見ることができるけれどなるべく小さい、1 ドットの高さや幅におおよそ一致する、長さの単位です。定義によれば、これは閲覧者の目から腕の長さまで離れた位置での、画素密度 96DPI の単一ピクセルの物理的サイズです。

その定義には、もちろん大きな揺らぎがあります。「快適に見ることができる」や「腕の長さ」などの不正確な用語は、人から人へと伝えるうちに変化してしまいます。例えば、あるユーザーがデスクトップの前にある机に着くとき、そのディスプレイは一般的に、例えば携帯電話に向かうときと比べて、ユーザーの目からかなり遠い位置にあります。

そのため、一般的には「単位 px を使うときに得られる値は、スクリーンの実際の画素密度に関係なく、スクリーンの 1 インチに 96px とほとんど等しくなる距離です。」と言えば事足ります。あるいは、「もしユーザーが画素密度 266DPI の電話を持っていて、そのスクリーン上に幅 96px の要素がある場合、その実際の幅は 266 device pixels だろう。」とも言えます。