垂直CSS声明的百分比值的优点和推荐用途是什么？
换句话说，在响应式设计中，我们是否忽略了％对em有益的东西？
因为在大多数情况下（除了您希望所有方面都相同的情况; credit），em会比%提供更好的服务，请考虑：
使用百分比填充水平值的百分比，CSS中元素的边距或边框是相当标准的 - 尤其是在响应式网页设计中。例如，取margin-left: 7.2%和padding: 0 5%。它也是有道理的：屏幕越宽，空间就会按比例增加。
一个可以对垂直值执行相同的操作：
margin-top: 5%;
padding: 10% 0;
border: 1% 0 2% 0;
正如预期的那样，增加的视口宽度将增加相应的垂直空间。
然而，在我遇到的情况下，它看起来有点奇怪 - 不适合设计。似乎可以更好地服务em值。*但是，另一方面，使用百分比在哪里是有益的？
*由于这些不会随着屏幕的宽度而增加，但会根据页面的字体大小而增加。
答案 0 :(得分：2)
我认为这个问题没有任何正确或错误的答案。它确实取决于您的设计。
正如您所指出的那样，％值，即使是在保证金和基础上的基于垂直的属性上也是如此。填充，仍然相对于文档的 width 。因此，如果您的设计需要均匀填充，那么全面的％值都很棒。
但是，如果设计是面向内容的，并且您仍然在响应式设计的水平属性上使用％值，则％可能不是垂直属性的最佳值。例如，您可能希望padding-top正好是1行文本的高度。所以你要使用ems。
但我离题了;它确实取决于您的设计和个人偏好。
答案 1 :(得分：2)
是的，视情况而定，就像任何其他css练习一样。
假设您有一个使用100％屏幕高度的容器div，并且您想要显示在div顶部的标题。您可以在标题上说margin-top: 15px，这样可行，但如果我来手机查看它，它看起来会非常紧张。
所以相反你说margin-top: 10%然后无论我来到哪个屏幕并且在你的标题上查看你的网站总是从div的顶部10％。这意味着您的布局的相对流量将始终相同。
一般规则是这样的：对于任何有效的CSS，你可以写一个用例，它是实现你的设计目标的最佳方式。忘掉那些说“绝不使用负边距”或“总是避免绝对定位”或任何其他废话的人。
答案 2 :(得分：0)
我最近也一直在思考这个问题，并且在浏览互联网之后，经验法则是＆＃39;我开始依赖如下。首先，％为横轴的良好响应设计的原因是因为众所周知，浏览器的宽度可能会有很大差异，具体取决于用户是在手机还是计算机上。垂直轴是不同的，因为虽然它也可以像水平轴一样变化，但是为垂直滚动创建了许多网页，并且用户期望向下滚动。在这种情况下，由于响应能力较弱的ems，可以进行更多的垂直滚动。
要根据这个假设回答你的问题，你将％用作垂直边距的时间就是你有一个设计，你不想让用户滚动很多看到一部分页。具体示例可能是单页Web应用程序，您不需要任何滚动或标题或初始页面内容，例如您希望用户完整查看而无需向下滚动的图片。