2

我正在努力研究如何使我的 CSS 尽可能与我的 HTML 分离。做到这一点的方法是以标准方式在 HTML 中编写基本布局元素，以便不同的 CSS 文件可以准确地知道它正在使用的标记的外观，而无需看到它。

所以我想知道是否有一套标准来说明你应该如何命名你的布局元素以及放置它们的顺序。例如标记我的页面的明智方法如下（注意我使用的是 HTML5元素并遵循您永远不应该将 ID 用于 CSS 规则的理论）：

<body>
  <div class="container"> <!-- central "squeeze" for the content -->
    <header>
      <img class="logo" />
      <nav class="primary"></nav> <!-- main navigation -->
    </header>
    <aside class="pre"></aside> <!-- left column -->
    <article class="main"></article> <!-- central main content -->
    <aside class="post"></aside> <!-- right column -->
  </div>
</body>

许多页面使用类似于此基本布局的内容。但正如您所见，“容器”或“主”类的名称会有很大差异，<aside>for 列的使用也会如此。此外，排序可能存在差异，例如有些人会将元素放在<nav>元素之后<header>而不是在其内部，或者将列元素放在元素内部<article>。

有谁知道为标准化这些常用布局元素的排序和命名所做的任何工作？像微格式什么的？

4

1 回答 1

3

我不认为有一个绝对的标准，因为没有两个网站是相同的。

好吧，有些是，但这不是重点。:)

无论如何，由于 CSS 是专门为标记该单个网站而制作的，因此您实际上无法将其解耦得如此详细。你不会找到一些现成的 CSS 表，你可以插入你的网站来放置所有这些导航容器。

我认为最好的方法是为自己制定一个标准并坚持下去。我希望你能找到比经常使用但相当抽象的“容器”更好的名称。也许，有一天，它会成为事实上的标准。

于 2011-12-23T11:28:29.290 回答