html样式的元素,样式化HTML元素的正确方法

许多不必要的标签会产生一个称为“标签汤”(ref)的问题。这是手写HTML中的一个问题;你的目标是使用CSS样式发挥最大潜力，并避免使用多余和无意义的标签。

在“正确”创建文档时，您应该从文档大纲的角度出发。想象一下，该页面是一个报告，它将从上到下阅读，并且左对齐且风格简单。您使用最少的标记设计此层次结构，充分利用标题，部分，文章和页脚标记。在“过去的日子”中，你会使用div代替。

接下来，应用样式来影响外观，包括文档中元素相对于彼此的定位。这是可以添加任何非语义div的地方，以便于在盒子模型中进行定位和组织。同样，您仍尝试将包装或非语义标签保持在最低限度。

考虑到所有这些因素，通常，大型网站不会由干净且严格的语义文档大纲组成。通常，这些站点由代码组装，在整个页面中构建动态内容。在这些场景中，更多的非语义包装标签通常作为生成HTML片段的模块化，自包含代码的副产品。此外，Web应用程序可能需要包装标签以帮助通过AJAX或其他JavaScript操作重新绘制动态内容。

CSS进入游戏的地方也是添加非语义包装标签的一个因素。由于CSS特异性(magic!)，有时需要一些额外的“句柄”，您可以使用这些句柄来真正地，特定地识别特定标记组合。

外卖是编写您可以在项目中管理的最干净，最语义的代码。除了最小化和语义之外，本身并没有“正确的方法”。

进一步阅读