Question

我正在尝试弄清楚如何使我的CSS尽可能地从我的HTML中解耦。这样做的方法是以标准方式在HTML中编写基本布局元素，这样不同的CSS文件就可以准确地知道它所使用的标记在没有看到的情况下会是什么样的。

所以我想知道是否存在一套标准，用于命名布局元素以及将它们放入的顺序。例如。标记我的页面的一种明智的方法如下（注意我正在使用HTML5元素并跟随the theory that you should never use IDs for CSS rules）：

<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>对列的使用也会有所不同。此外，排序可能存在差异，例如有些人会将<nav>元素放在<header>之后而不是放在<article>元素内，或者放在{{1}}元素中的列元素。

有没有人知道为标准化这些常用布局元素的排序和命名而做的任何工作？像微格式或其他东西？

Answer 1

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

好吧，有些人，但这不是重点。：）

无论如何，由于CSS专门用于标记单个网站，因此您实际上无法将其详细解耦。您将找不到一些现成的CSS工作表，您只需插入您的网站即可放置所有这些导航容器。

我认为最好的方法是为自己提出一个标准并坚持下去。我希望你能找到比常用但非常抽象的'容器'更好的名字。也许，有一天，它将成为事实上的标准。

HTML布局元素类名称的标准？

1 个答案: