Question

开发布局的最佳做法是什么？限制divs更好吗？我正在浏览一些热门网站的html / css，他们似乎都在div中有div。例如，整个页面的div，顶部栏的div，徽标顶部栏中的div，搜索栏等。

这是一个好习惯吗？我想正确地定位所有div并且将必要的元素放在div中更容易。这就是我迄今为止所做的一切，但我想确保我正在学习正确的方法。

对此有任何帮助表示赞赏。谢谢！

Answer 1

当您需要<div>（这是divide应该用于的{页面}）页面的各个部分时，请使用div。例如，来自内容的页眉/页脚，或博客上的个别帖子但是，当语义上另一个元素有意义时，你不应该使用它们。

如果前面提到的博客上的存档仅显示了存档中每个帖子的两行摘要，则在定义按顺序排列的项目列表时，有序列表可能更有意义。 <li>元素也是块元素，可以完全相同的方式设置样式。

有时，嵌套<div>标签是有意义的，有时你不应该这样做作为一项基本测试，假设读者正在为视障用户解析您的页面。它需要知道文档的每个节点中的内容，以便它可以正确地通知它。它并不关心你的视觉CSS需要什么，它只是想尽可能准确地将它解析为语音。

要记住的基本要点：

Answer 2

根据定义，<div>是一个毫无意义的元素，所以它们中有多少并不重要。

但是，只要有意义，就需要在页面上设置<div>，如果有更适合工作的元素（语义上），则不要使用它们。

<div>This is a paragraph of text</div>

实际应该是

<p>This is a paragraph of text</p>

等等。

Answer 3

HTML中有这种“代码味道”的名称： Divitis 。

您应该扩展您对HTML中标记的语义含义的了解。你可以从阅读this article开始，但它更侧重于html4.01和xhtml。 HTML5中有几个新标签，现有HTML4标签的语义含义变化很小。

Answer 4

最大的问题通常是使用div还是表。表格会产生很多麻烦，其中一些你无法解决。但是div也有他们的问题。

无论您使用什么，嵌套级别确实可以使页面难以理解。因此，您应该支持所需的最少嵌套级别。同时，努力不嵌套也会使HTML难以理解。