屏幕上的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 Picas（1 pica = 12分）。

如果您想在任何地方使用厘米，但想要一英寸，请使用style="width: 2.54cm; height: 2.54cm;"以后的1 inch = 2.54cm。

Answer 2

这是不可能的。你只能得到一些近似值。将宽度和高度设置为1in是最好的镜头，但它并不是特别好的镜头，因为您可以看到是否测量尺寸（在不同的设备上）。作为CSS3单元模块describes，所谓的绝对单位可以锚定到物理单位或像素。像1in = 96px这样的固定关系则意味着（除了偶然）CSS in不是真正的物理英寸或CSS px不是真正的物理像素。 / p>

在纸面上，你可以期望一个物理单位成为锚单位，因此in真的是英寸。但即使这种期望也经常失败。