这些DIV是否真的必要?

3
我有时会创建一个只用于容纳另一个元素的div。
例如,在创建菜单时,我会创建一个div并为其分配背景颜色、位置等属性。然后在其中创建一个无序列表。
我肯定可以将我分配给DIV的所有属性都分配给UL,并且根本不使用div。
有什么最佳实践和原因吗?
谢谢。
Zenna
9个回答

4
标签可以用于组合语义相关的元素。如果你只是将一个块级元素包装起来,那么你只是在文件中增加了字节数。

而且,语义分组对于代码风格很有用,对吧?(我是初学者) - djangofan
它还会使DOM变得更大。当您想在其上执行JavaScript操作时,元素越少越好。 - Dykam
这对样式很有用,当然。但是,在阅读HTML时,将所有注释块分组放在一个div中仍然是有意义的。 - geowa4

2
不,它们不是。div元素的目的是创建文档中的块级结构。如果可以不用它们就不要用。永远不要使用div来解决设计问题,这是CSS的工作。使用像列表、数据定义或表格这样的HTML元素(过去被过度滥用,现在被用作css目的的div)。你对HTML的了解越多,就越不会到处使用div。

1

我经常使用div来避免子元素的padding/margin破坏父元素的宽度。但是你需要小心这种做法 - 否则你可能会添加一堆无用的东西。


宽度?我的唯一问题是子填充破坏了父容器的高度 :P - Daniel Sloof

1
实际问题在于我们正在以HTML的创造者从未想象过的方式使用它。需要“所有这些div”的原因是因为一些非常聪明的人已经找到了一些非常现代的方法来利用一个非常古老的标准。

这不是 OP 添加不必要的 DIV 元素的原因。 - AmbroseChapel

1

最佳实践应该是尽可能少地使用 div 元素。如果你有一个只有一个子元素的 div 元素,很可能它是一个无用的 div。当你需要一个块级元素而又没有语义预定义的元素时,才真正需要使用 div 元素。这包括像 Renesis 建议的那样对元素进行分组。


0
标签是一种必要的恶,如果没有更语义化的标签集合。
它们的目的是作为一个通用容器。因此,我想你可以说它们做得很好。

希望在HTML 5推出后,我们会看到更少使用div来进行排版。 - Steven
那么画布将成为新的表格。 - geowa4

0
如果你可以在不使用额外的div的情况下完成你想做的事情,那就不要加。如果它是你设计中重要的一部分,而且你无法通过一些聪明的CSS来解决,那么使用它仍然比使用表格好得多...

0

我主要使用DIVS至少有以下两个主要原因:

  • 我需要它在某种程度上提供新的CSS物理级别(例如,在固定宽度元素内部进行子填充,图像周围的阴影或双边框等)
  • 它在逻辑上分组包含的元素(为了将来在HTML和CSS中的可移植性和语义 - 例如,“div#menu .label”。这样,我可以在多个位置使用“label”类,但是对于“menu” div中的标签应用特定的样式)。

例如,如果您将所有属性转移到UL,但随后决定在菜单上方或下方但在相同位置放置标题或图像,则必须再次创建DIV以将新元素放置在其中,并将一半的属性传输回去。


0
在UL的情况下,是的,DIV是不必要的。它们都是块级元素,因此您可以直接对UL本身进行任何DIV包装的操作。
然而,由于某些IE浏览器存在Box Model问题,有些人告诉您添加这些DIV作为解决方法。当您结合填充和宽度时,IE6与其他浏览器对元素的最终大小存在分歧。因此,一种解决方法是在内部元素上放置填充但不设置宽度,在外部元素上设置宽度但不设置填充。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接