0

我有一个简单的页面模板，左侧有一个侧边栏，右侧有一个主要内容区域。这是文章、旁白和标题标签的正确使用吗？此外，您是否想将类/ID 附加到 html5 元素（即 article class="example" ）还是专门用于 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 -->
4

2 回答 2

2

您当然可以将 aclass和/或 anid应用于 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>标签内。

于 2013-11-07T18:57:06.330 回答
0

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

您对<article>and '' 的使用可能范围太广。

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

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

于 2013-11-07T18:57:51.080 回答