我正在重建一个个人网站以了解有关 HTML 5 的更多信息。在此过程中,我正在移动我的博客文章以使用一些新的 HTML 5 元素,例如 header/article/section/aside。举个例子,博客文章的格式如下:
我的博客文章标题
[博客发布日期在这里]
提供内容概述的单个段落。
[我的第一个字幕]
与第一个字幕关联的内容
[我的第二个字幕]
与第二个字幕关联的内容
[评论到这里]
除此之外,我还会有一些内容,可能是帖子右侧的引文或图形。我有两个挑战:1)我不确定如何使用 HTML 5 元素之间的关系,特别是文章和部分让我感到困惑。2)如何让我的旁白元素位于我其余内容的右侧。目前,我有以下内容:
<header>
<h1>My Blog Post Title</h1>
<p>Published <time datetime='18-06-2013'>June 6, 2013</time></p>
</header>
<div>
<article>
<p>A single paragraph that provides an overview of the content.</p>
<section>
<header>My first subtitle</header>
The content associated witht he first subtitle.
</section>
<section>
<header>My second subtitle</header>
The content associated with the second subtitle.
</section>
</article>
<aside>
My right side content. This area should take up 33% of the entire width.
</aside>
</div>
我在正确的道路上吗?我看到关于文章与部分的各种东西?无论哪种方式,目前,我的aside
内容都显示在我的文章内容下方。实际上,我希望它在它旁边。有谁知道 CSS 提供这种布局的适当方式?
谢谢