Question

显然，点（pt）不应该在网络上使用，只能在印刷媒体上使用。如果您想要一个像素完美的网站表示，应该使用像素（px）。百分比（％）和ems（em）的工作方式几乎相同，如果您希望在缩放等时使您的网站具有可扩展性，则应该使用它。

五分钟前，我编写了几行代码，并在Chrome，Firefox，Safari，IE和iPhone 5中进行了测试。

<html>
<p style="font-size:16px;">Dette er en test</p>
<p style="font-size:100%;">Dette er en test</p>
<p style="font-size:1em;">Dette er en test</p>
<p style="font-size:12pt;">Dette er en test</p>
</html>

当我放大和缩小时，所有段落都保持相同的大小。那么你使用什么样的单位真的很重要吗？

Answer 1

好吧，我发现了一篇很棒的文章：http://alistapart.com/article/howtosizetextincss

他的结论：

我们的任务是找到一种方法来调整文本大小，使设计人员能够保持对排版的准确控制，而不会牺牲用户调整阅读环境的能力。我们测试了各种常见浏览器的单位。在ems中调整文本和行高，在主体上指定百分比（以及Safari 2的可选警告），显示可以在当今常用的所有浏览器中提供准确，可调整大小的文本。这是一种技术，您可以将其放入工具包中，并将其用作CSS中调整文本大小的最佳实践，以满足设计师和读者的需求。

Ems可能很难处理，特别是在深深嵌入元素时，因为很难跟踪数学。但是，很好地评论你的样式表和从正文向内的样式元素可以使事情更容易遵循。这个更复杂的示例及其附带的样式表演示了如何使用body作为起点来确定嵌套元素的大小。

希望它有所帮助。

Answer 2

em单元是Web上最新和即将推出的字体大小标准，但实际上，百分比单位似乎为用户提供了更加一致且易于访问的显示。

当客户端设置发生变化时，文本百分比会以合理的比例缩放，从而可以保留可读性，可访问性和可视化设计。

所以我建议你使用百分比。

Here 您可以查看转化情况，希望有所帮助。

Answer 3

不同的单位在不同的情况下很有用。要知道何时使用哪个单元，您必须知道它们的作用。这很好地解释了in the MDN，或者您更喜欢in the W3 spec（对于％，请参见下文）。

以下是MDN对您提及的单位类型的引用：

<强> EM
   此单位表示元素的计算字体大小。如果在font-size属性本身上使用，则表示元素的继承字体大小。

<强> PX
  相对于观看设备。    对于屏幕显示，通常是显示器的一个设备像素（点）。    对于打印机和超高分辨率屏幕，一个CSS像素意味着多个设备像素，因此每英寸像素数保持在96左右。

<强> PT
  一点（1/72英寸）。

百分比是奇数，有its own MDN page。

许多长度属性使用百分比，例如宽度，边距和填充。百分比也可以在font-size中看到，其中文本的大小与其父级的大小直接相关。

或其自己的小节in the W3 spec：

百分比值始终相对于另一个值，例如长度。允许百分比的每个属性还定义百分比所引用的值。该值可以是同一元素的另一个属性的值，祖先元素的属性或格式化上下文的值（例如，包含块的宽度）。当为根元素的属性设置百分比值并且百分比被定义为引用某个属性的继承值时，结果值是该属性的初始值的百分比倍。

所以“是”，你选择哪个很重要，他们每个人都可以在不同的环境中拥有不同的效果（无论他们是否经常会导致相同 >结果）。

CSS font-size：你使用什么样的单位是否重要？

3 个答案: