2

显然，点 (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>

发生的事情是，当我放大和缩小时，所有段落的大小都保持不变。那么你使用什么样的单位真的很重要吗？

4

3 回答 3

1

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

他的结论：

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

使用 Ems 可能会很棘手，尤其是在深度嵌套元素时，因为很难跟踪数学。但是，很好地注释您的样式表并从正文向内设置元素样式可以使事情更容易理解。这个更复杂的示例及其随附的样式表演示了如何使用主体作为起点来调整嵌套元素的大小。

希望能帮助到你。

于 2013-01-30T10:56:23.110 回答
0

不同的单位在不同的情况下有用。要知道何时使用哪个单元，您必须知道它们的作用。这在 MDN 中得到了很好的解释，或者如果您更喜欢W3 规范中的说明（对于 %，请参见下文）。

这是 MDN 对您提到的单位类型的引用：

em
这个单位表示计算出来的元素的字体大小。如果在 font-size 属性本身上使用，它表示元素的继承字体大小。

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

pt
一点（即 1/72 英寸）。

百分比是奇数，有自己的 MDN 页面。

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

或者W3 规范中它自己的小节：

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

所以“是的”，你选择哪个很重要，它们在不同的情况下都会产生不同的效果（不管它们通常也会导致相同的结果）。

于 2013-01-30T11:05:53.370 回答
0

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

当客户端设置发生变化时，百分比文本会以合理的速度缩放，让您保持可读性、可访问性和视觉设计。

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

在这里你可以看看转换，希望它有所帮助。

于 2013-01-30T10:57:30.237 回答