CSSで利用できる絶対サイズの単位がいくつかあることは知っています。たとえば、cm、in、mm ...しかし、Webページでそれらを使用する場合、それらが尊重されることはめったにありません。
画面の物理サイズとピクセル解像度に関する情報は、EDIDから入手できる必要があります。これにより、ブラウザはそれらにアクセスして、その特定のデバイスで1cmのピクセル数を計算できます。私は、プロジェクターではなく、通常のCRT /LED/プラズマスクリーンについて話しています。
モバイルデバイスで使用したいです。一般的な基準は、すべてのタッチターゲットのサイズが少なくとも9mmであることです。しかしheight: 9mm、CSSコードで使用する場合、実際のサイズはHTCDesireHDで約3mmです。
では、絶対サイズを使用してブラウザに要素を表示させるにはどうすればよいですか？
できません。何らかの理由で、モバイルデバイスのブラウザは、幅1in（ "1インチ"）のサイズの要素が96ピクセル幅であることを均一に通知します。実際の解像度は関係ありません。それは彼ら全員が言うことです。
気を失うことなく問題に取り組む唯一の方法は、「仮想ピクセル」の適切なサイズ設定に対するすべての責任をデバイスメーカー（およびデバイスソフトウェアサプライヤー）に与えることです。言い換えれば、Apple、Google、Samsung、LG、HTC、Motorolaなどを信頼して、実際のピクセル数に関係なく、ユーザーが見ているデバイスで16pxのテキストを読み取れるようにするデバイスを一般に提供する必要があります。単一の16pxグリフで。
時々、あなたは負けます。新しいiPadMiniは、iPad 2と同じ画面サイズを報告しますが、画面がはるかに小さいため、良い例です。つまり、iPad 2できれいでクリアな16pxは、iPadMiniではかなり小さいということです。あなたのウェブページがそれがiPadMiniとiPad2のどちらにあるかを理解することは事実上不可能です（設計上！Appleは意図的にそうしました）ので、正味の効果はiPadMiniの不幸な購入者が病気であるということです-メーカーが提供します。
対照的に、Nexus7タブレットの実際の画面解像度はiPadMiniよりも高くなりますが、Webページに報告される画面サイズは小さくなります。つまり、そのデバイスの16ピクセルのテキストは見栄えがよく、Nexus7の所有者はそのメーカーから十分なサービスを受けています。
（もちろん、ユーザーがレイアウトを微調整できるツールを提供することもできます。レスポンシブサイトの場合、ブラウザーのさまざまな特性（バグ）により、使い慣れたモバイルデバイスのジェスチャーでピンチ可能/ズーム可能なサイトを適切に機能させることは非常に困難です。）
これは、デバイスの設定に大きく依存します。多くの場合、「互換性の理由」のために、真の相互運用性は、製品を市場に出すことと引き換えになっています。
言い換えれば、デバイスベンダーは、クライアントが「知っているとおりに」サーフィンできるように、クライアントのWebサイトを修正しました。
- 対角cm（インチ）：11（4.3）
- 解像度：480×800
- ppcm（PPI）：85（217）*
- CSSピクセル比：1.5
*所定の表示サイズに基づく概算。
リストを見ると、これはデバイスごとに異なることが想像できます。したがって、デバイス自体を信頼することはできません。
これを解決したい場合は、採用できるように構成する方法をユーザーに提供する必要があります。一部のベンダー/ブラウザは、これらのデバイスに本物を実行するように指示するヘッダーを提供しています。これはすべて依存しており、これを簡単かつグローバルに解決するための優れたリソースが手元にありません。さまざまなモデルとそのブラウザソフトウェアを調査することから始め、いくつかの一般的な手順が利用可能であり、それらが連携して機能する場合は、マトリックスを作成します。
それまでは、ユーザーに実際の設定を使用するように依頼しますが、ユーザーの好みに基づいてbody要素に採用された設定を行います。
9mm9ミリメートルの物理的な測定とは異なる2つの基本的なことがあります。
まず、ディスプレイデバイスでは、アンカーユニット（CSS値とユニットモジュールレベル3で説明）は通常ピクセルであり、ユニットは式==が満たさmmれるように解釈されます。（原則として物理的なミリメートルに固定されるべきである印刷媒体でさえ、それはそれからいくらか逸脱します。）これについてあなたができることは何もありません。1in25.4mm96pxmm
次に、モバイルデバイスでは、ブラウザは通常、ページを自動的に拡大縮小します。その理由は、それ以外の場合、ほとんどのページはより大きな画面用に設計されているため（各方向のピクセル数に関しても）、非常に悪い動作をするためです。これは、次のようなタグを使用して防ぐことができます
<meta name="viewport" content="width=device-width, initial-scale=1">
これは、ページが実際に小さいサイズを含むさまざまなビューポートサイズに適応するように設計されている場合にのみ使用する必要があります。
これらの実際の測定値が信頼できる場合は、印刷形式で使用した場合にのみ信頼できます。電子的なものはすべて、ピクセルの観点から考えます。実際の測定の観点から、それらのピクセルが何に変換されるかではありません。たとえば、デバイスを異なる解像度とDPIのプロジェクターまたは外部モニターに接続する場合、cmとmmは何を意味するのでしょうか。
mmとcmが何に変換されるかを追跡するデバイスはどれですか？ディスプレイデバイスまたはディスプレイデータを送信するデバイス？面倒すぎます。RL測定は印刷専用であり、それでも私の経験では少し厄介なことがあります。少なくとも数年前の私の経験は危険でした。
私は方法を考え出しました。ほとんどのブラウザーは、ユーザーエージェントヘッダーのHTTPリクエストに沿ってデバイスタイプを送信します。その情報に基づいて、サーバー上で実際のDPIを見つけて、応答で（たとえば、変更されたCSSとして）送り返すことができます。
ただし、正確なDPIを取得するには、デバイスのデータベースを維持および維持するのにコストがかかります。一連の共通パラメーターからの近似DPIを使用することになりました。その場合、1mmは一定ではありませんが、差は最小限に抑える必要があります（通常）。