css - 画面上の CSS 1x1 インチ ボックス

Question

ボックスを 1x1 インチに指定するにはどうすればよいですか。これは 1x1 インチのボックスとして印刷され、画面上では 1x1 インチのボックスとして表示されます。

Answer 1

JSFiddle: http://jsfiddle.net/eR9CS/

インチ：

<div style="background-color: red; width: 1in; height: 1in;"></div>​

センチメートル:

<div style="background-color: red; width: 1cm; height: 1cm;"></div>​

相対的な長さの単位

• em計算されたフォント サイズ。
• ex小文字の「x」の高さ。
• px表示デバイスに相対的なピクセル。
• %パーセンテージ。
• remルート要素のフォント サイズ。
• vwビューポートの幅。
• vhビューポートの高さ。
• vmビューポートの幅または高さの小さい方の値。
• chゼロ幅 (レンダリング フォントのゼロ グリフの幅)。

絶対長さの単位

• inインチ (1 インチ = 2.54 センチメートル)。
• cmセンチメートル。
• mmミリメートル。
• ptポイント (1 ポイント = 1/72 インチ)。
• pcパイカ (1 パイカ = 12 ポイント)。

どこでもセンチメートルを使用したいが、インチが必要な場合はstyle="width: 2.54cm; height: 2.54cm;"、 sinceを使用し1 inch = 2.54cmます。

Answer 2

これは不可能です。いくつかの近似値しか取得できません。幅と高さを に設定するの1inがベスト ショットですが、(さまざまなデバイスで) 寸法を測定するとわかるように、特に良いショットではありません。CSS3 Units モジュールで説明されているように、いわゆる絶対単位は、物理単位またはピクセルのいずれかに固定できます。1in=のような固定関係は96px、(偶然を除いて) CSSinが実際の物理的なインチpxではないか、CSS が実際の物理的なピクセルではないことを意味します。

紙の上では、物理単位がアンカー単位であると予想できるため、in実際にはインチになります。しかし、この期待でさえしばしば失敗します。