我应该在 HTML 中使用 % 还是 'px'答案

【问题标题】：Should I use % or 'px' in HTML我应该在 HTML 中使用 % 还是 'px'
【发布时间】：2012-03-10 15:47:57
【问题描述】：

无论是 HTML、XHTML 还是 HTML5，您都会发现那些令人讨厌的百分比随处可见。然而......我看到很多网站都不敢靠近它们。然而，我总是被 uni 鼓励去使用它们。

那么我应该使用哪个？哪个会带来更好的网站设计？为什么？

我知道要避免使用高度，尽管如果我想使用百分比，HTML5 真的不喜欢我不指定高度。

感谢您抽出宝贵时间阅读。

【问题讨论】：

答案视情况而定。但是告诉我，为什么你认为百分比很烦人？
取决于你想做什么。对此没有统一的答案。
我知道要避免使用高度...???
这里有一个很好的答案，也涵盖了 em：stackoverflow.com/questions/609517/why-em-instead-of-px
@Ravenshade 现在我明白了。您认为您看到了 HTML4 和 HTML5 之间的区别，但实际上您看到的是 quirks 模式和 strict 模式之间的区别。在 Quirks 模式下，html 和 body 默认具有窗口的高度。但在严格模式下（在 HTML4 和 HTML5 中），它们的行为与所有其他块元素一样，默认获取内容的高度。因此，如果您希望它们具有窗口的高度，则应明确指定它们的高度！

标签： html css units-of-measurement

【解决方案1】：

这真的取决于你想要建立什么。
有时我需要建立一个可供某些残障人士阅读的网站。例如，如果老年人也访问您的网站，则最好使用 % 以便他们可以放大您的页面，并且布局仍然看起来很漂亮。

Fixed Design Layouts Fixed 设计布局具有特定的宽度并且可以不缩放以适应浏览器窗口。使用它的网站可以与左对齐、居中甚至右对齐需要时。

固定布局的好处：使用固定设计布局，您可以控制超过网页上元素的行长、流向和位置页。设计师有固定的工作空间和线条长度可以轻松指定文本的位置和图像的位置。

固定布局的缺点：固定设计布局往往会留下很多在高屏幕上查看时，设计两侧的空白区域决议。这使网页的大小相形见绌，并给出了一个感觉它漂浮在屏幕上。

Fluid Layout Fluid 设计布局使用百分比而不是像素来定义它们的宽度并填充整个浏览器窗口。他们是也称为固定设计或动态设计。

流体布局的好处：流体设计的主要好处之一布局是他们的辅助功能。他们迎合更多的用户。这是因为，无论屏幕分辨率或用户的设备，固定设计布局更好地适应。它利用将整个浏览器窗口分散开来。这样可以最大化面积显示的内容和更多信息可以在一个走。因此，窗口屏幕上没有空白空间。这是一个与留下大量空间的固定布局相比，这是更好的选择空白处。

【讨论】：

我觉得有点js，你可以在流动和固定之间找到平衡
你确定！但我总是想将样式与 css 分开，因为对我来说，html 用于描述标记，css 用于样式，js 用于功能。但你是对的！
非常正确，我在想也许你可以设置 css 以便它在没有 js 的情况下工作，但是如果启用了 js，那么它会找到适合窗口大小的最佳布局。我认为有些网站会使用这种技术，尽管纯 CSS 解决方案总是最好的。
是的，我的意思是，当你能够做到的时候，为什么不利用 js 的优势 ;-) 但是建立盲人可读的网站和可以扩展的网站，所以一个字母和屏幕一样大真的很难：D
啊..不，要获得一个与屏幕一样大的字母并不难。难的是防止同一个字母离开它的父 div >_>

【解决方案2】：

对于字体，如果您不希望在 Internet Explorer 中固定字体大小，则应使用百分比（或 em 或 rems）。如果您使用像素，那么在浏览器设置中更改默认字体大小的 Internet Explorer 用户将不会看到字体增加/减少。因此，这会使您的文本对于该浏览器中的用户的可读性可能会降低。

Dan Cederholm 的Bulletproof Web Design 的第一章是一个很好的资源。

对于布局，使用百分比或 em 将使您的设计更灵活地更改字体大小/本地化等。这也包括在本书中。

【讨论】：

I.E...我们还没长大吗？摇头。不过，感谢您的提醒。
@Ravenshade 你不可能是大公司的网页设计师，因为如果你仍然会知道很多人仍然使用 IE，尤其是公司。
当然，我不是大公司的网页设计师......我看不出我曾经在哪里推断过。也就是说，IE 的使用正在下降。我不知道有哪家公司再使用 IE，与我合作的组织都没有使用 IE 作为默认浏览器。