html - 流体布局中的 Ems 或像素？

Question

我正在创建一个可以在不同设备上运行的新网页，并且我正在使用流畅的布局。我应该在流体布局中使用像素还是 em 来确定字体大小？那么填充物等呢？

Answer 1

对于流体布局，您将需要使用百分比。像素与显示器分辨率相关，而 EM 与字体大小和像素密度相关。然而，百分比与放置它们的窗口的大小（或它们的父窗口的宽度）有关。因此，它是流动性的最佳选择。您的填充也可以是百分比，请记住这些值是相对的，因此在等距间距时会变得很棘手。

对于字体，ems 是完全可以接受的，因为它们是基于字体本身的。此外，通过使用 ems 字体，您可以通过更改文档字体大小来缩放整个站点的字体。

Answer 2

如果您使用 em，您可以对不同的设备宽度使用 css 媒体查询。

在正文字体大小上使用 px 并在其他所有内容上使用 em 意味着所有字体大小都将相对于正文。然后，您可以包含仅增加或减少正文字体大小的媒体查询，并且所有其他字体大小将相对于它发生变化。

然后，您还可以添加 Web 可访问性按钮，为有视觉障碍的人增加字体大小。该按钮也只会更改正文字体大小（再次更改与其相关的所有其他字体）。

Em一路走好！

（额外编辑）此外，如果您正在深入考虑字体大小，您还可以考虑您网站的垂直节奏/基线。查看这些链接：

http://alistapart.com/article/settingtypeontheweb

http://typecast.com/blog/4-simple-steps-to-vertical-rhythm

为正文设置 px，然后为所有其他字体大小、行高、边距等设置 em，这将使您能够在保持垂直节奏的同时创建流畅的设计。坏蛋。

Answer 3

我发现“ems”更适合用于流体布局或任何布局。