给body标签添加样式是一个好主意吗？

Question

6

在我的固定宽度网站中，我有一个类似于这样的布局：

<div id="wrapper">
  <header>...</header>
  <div id="content">...</div>
  <footer>...</footer>
</div>

我的CSS与下面的代码类似：

#wrapper {
  width: 700px;
  margin-left: auto;
  margin-right: auto;
}

将 <body> 标签的样式设置为相同也可以起到作用，并且使我的代码更易读，因为我有较少的嵌套的 <div> 标签。

将边距和固定宽度应用于 <body> 是一个安全的想法吗？

- Blender

我认为，虽然这种方式很“安全”，但是固定宽度的网站并不是利用媒介的好方法。 - jcomeau_ictx

这真的取决于你所谈论的样式类型。如果你在谈论背景颜色，那么请务必将其应用于整个页面。如果你在谈论设置宽度，则下面提到了一些需要考虑的因素。 - user636044

3个回答

2

我现在正在使用XHTML Strict doctype测试这些元素的宽度/边距/填充，以下是对于<body>的测试结果:

IE 5.5 - 失败（无法设置宽度，或者背景超出尺寸），填充/边距可以

IE 6 - 通过

IE 7 - 通过

IE 8 - 宽度正确但填充/边距不完美

我使用的页面链接在这里

测试将宽度和边距应用于html元素的效果，链接在这里:

IE 5.5 - 同上，但是边距/填充无效

IE 6 - 不会遵守宽度

IE 7 - 宽度正确但是无法使用display:block和margin:0 auto将其居中

IE 8 - 宽度正确但填充/边距不完美

在所有情况下，当将宽度设置为html元素时，实际上呈现出的效果就像填充一样，约束了body元素。

这很有趣，但我已经没有精力继续了，是时候回到实际工作中了 ;)

- Wesley Murch

我怀疑很少有人使用IE 5.5，但我不知道这种情况会发生在IE6/7的<html>元素上。我将不得不尝试一些疯狂的CSS并看看我能破坏什么... - Blender

1

是的，当然没有人在使用IE5.5了，但我想如果它能在IE 5.5中正常运行，我们使用它时会感到更加安全。 - Wesley Murch

0

对body标签进行样式设置是可以的，但这意味着如果您需要在网站上进行更改，您就没有其他“备用”标签可供修改。body标签通常是一个安全的标签，可以留下以便于未来的更改。

对于jcomeau_ictx：使用固定宽度网站的原因有很多。我认为你会发现固定宽度网站比流体网站更多。

- cusimar9

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- kapa · Accepted Answer

它是完全安全的，body就像所有其他HTML元素一样。

对于您的布局，您可能仍然希望使用#wrapper（似乎是一个固定宽度的布局），因为您可能想为body设置背景（或者对可见的“空白”空间进行处理）。