html - HTML 布局元素类名称的标准?

标签 html css standards microformats

我正在尝试弄清楚如何使 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> 内的列元素元素。

有谁知道为标准化这些常用布局元素的排序和命名所做的工作吗?比如微格式之类的?

最佳答案

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

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

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

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

关于html - HTML 布局元素类名称的标准?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8615464/

相关文章:

c++ - STL 标准判断哪些算法有拷贝版本,哪些没有?

javascript - 需要表格来填充搜索栏的搜索结果

html - 计算机如何调整图像的大小?

Javascript 滑入加载

html - 如果 PURE CSS 中存在兄弟元素,则有条件地设置样式

html - IE 中的按钮大小错误

jquery - 如何在 JQuery 中将 css 类添加到 Div 元素?

f# - 何时使用自定义运算符的标准

c++ - std::notify_all_at_thread_exit 是如何工作的?

html - 使用css限制屏幕大小