Question

我有一个简单的页面模板，左侧有一个侧边栏，右侧有一个主要内容区域。这是正确使用文章，旁边和标题标签？另外，你是否想要将类/ ids附加到html5元素（即文章类=＆＃34;示例＆＃34;）或者仅适用于div？

由于

<article class="page">

  <div class="container">

    <div class="row">

      <aside>

        <div class="col-md-3">

          <div class="sidebar">

            <h3>Sidebar Widget</h3>

              <ul>

                <li>Related Content</li>

                <li>Related Content</li>

                <li>Related Content</li>

              </ul>

          </div> <!-- /.sidebar-->

        </div> <!-- /.col-med-3 -->

      <aside>

      <div class="col-md-9">

        <header>

          <h1 class="page-title">Page Title</h1>

        </header>

          <p>Some Content</p>

      </div> <!-- /.col-med-9 -->

    </div><!-- /.row  -->

  </div><!-- /.container-->

</article><!-- /.page -->

Answer 1

您当然可以将class和/或id应用于HTML5代码。将每个标记视为<div>。实际上，在CSS中你应该有这个块，所以所有HTML5标签的行为都像<div>。这将有助于非HTML5兼容的浏览器：

header, section, footer, aside, nav, article, figure {
    display: block;
}

如果您以“正确”方式使用所有HTML5标签，我无法评论，因为我不知道您项目的更大范围。但是，您似乎正确使用<aside>。我会使用<section>而不是您使用它的<article>。以下是一些简单的英语解释，以帮助您：

<article> - 独立，自足的内容。如果与HTML文档的其余部分分开，它应该能够独立存在并且有意义。最显着的潜在用途是论坛/博客帖子，用户评论等。

<aside> - 支持有关HTML大图的信息。这些主要用于侧边栏，主要内容的左侧或右侧，作为“支持演员”的一部分。

<header> - 顾名思义，这是您的标题信息应该去的地方。您可以在整个HTML页面中使用多个<header>代码（例如，用于博客帖子标题），但不能在<footer>，<address>或其他<header>代码中添加这些代码。

<section> - 更多“通用”标记，但它用于包含大块分组内容。多个HTML5标记可以驻留在<section>标记内。

Answer 2

将id和类放在任何/所有html元素上是完全正常的。

您对<article>和''的使用可能过于广泛。

<article>元素表示页面的一个组成部分，该页面由文档，页面，应用程序或站点中的自包含组合构成，并且可以独立分发或重用，例如，在联合。 Source

<aside>元素表示页面的一部分，该部分由与旁边元素周围的内容相切的内容组成，并且可以被视为与该内容分开。 Source

正确使用文章，旁边和标题标签

2 个答案: