Question

在line-height中添加body{line-height:1.5}是否合适，或者如果我为p{ line height:1em}等标记分别添加标题会更好。

编辑：

body {line-height：in em}如果我们将带有float的图像放在里面会产生问题

编辑：2010年4月24日：

如果我必须为元素添加不同的行高

像

p {line-height: 1.4}

h1 {line-height:1.6}

h2 {line-height:1.2}

ul li {line-height:1.1}

然后我不应该在body {line-height:1.4}

中使用行高

如果body {line-height:1.4}和h1 {line-height:1.6}那么h1的行高是多少？

Answer 1

这取决于。如果你把它放在身体然后你就会变得懒惰而不用担心再次这样做，但你会失去控制，因为页面上的所有内容都会将line-height设置为1.5。然而，如果您在每个标签中声明它，您将获得很多控制权，但必须做更多工作。

我个人会选择逐个标记的解决方案，但我是一个控制狂，所以......

Answer 2

显而易见的答案是，在身体中指定它的工作量较少（和开销）。

有一个明确的CON：如果你在行高中使用一个单位（比如'px'），你在主体上指定它，它将在整个页面中使用它。这可能会产生疯狂的结果，因为fe大页面标题相互重叠，或者文本旁边的文本在行之间变得荒谬的空白。如果你不使用单位，并在其他地方指定它，那么页面的垂直节奏会变得混乱。

设置行高时指定单位（在本例中为px）使值能够在整个页面中继承。如果一个单位已经指定了行高，乘数就是继承，导致行高与按比例呈现文本大小，从而打破了垂直节奏。

在网站上常见的是从不在线高上使用单位，这也是大多数网站看起来有点混乱的原因之一。看看这个页面，已经： - ）

我会在body元素上指定一个无单位的行高，并在指定的'content'区域使用基于单位的行高，在那里您可以准确地知道期望的内容类型（'content body'）。

* - 矛

Answer 3

关于在身体标记上添加行高的注意事项：

如果以百分比指定高度，您会直观地期望放大/缩小所有行高（例如50％缩小到一半，200％复制空间，100％没有任何反应）。

body {
  line-height: 120%
}

情况并非如此。对于段落和普通大小的文本，它可以正常工作。但是对于标题来说这是一场灾难，因为应用了与普通文本相同的行高...请看这里发生的事情：https://jsfiddle.net/11jgwzzu/。

如果使用例如1.5而不是150％，则可行。

考虑到这一点，我认为使用这样的东西是可以的：

body {
  line-height: 1.61 // Golden Ratio
}

使整个页面更加宽敞。如果你愿意，你仍然可以覆盖某些特定元素的这种行为，但我经常发现我甚至不必覆盖它，因为我认为line-height: 1.61在任何地方看起来都很好。

Answer 4

把它放在合适的地方

等