0

在下面的 HTML 语法中，metadiv 应该在header? 它只包含日期和作者姓名，应该出现在标题下。也是aside正确使用还是应该figure使用而不是aside？

<article class="article">
    <header>Heading</header>
    <div class="meta"> date and author info. </div> 
    <div class="wrap">
        <aside class="thumbnail"> <!-- left -->
            <img src="abc.jpg" />
        </aside>        
        <div class="content"> <!-- right -->
            ...
        </div>  
    </div>
</article>
4

3 回答 3

3

代替

<div class="meta"> date and author info. </div>

以下会更好

<footer> date and author info. </footer>

HTML5 规范<footer>说：

footer 元素表示其最近的祖先分段内容或分段根元素的页脚。页脚通常包含有关其部分的信息，例如作者、相关文档的链接、版权数据等。

并且

页脚不一定必须出现在部分的末尾...

对于<aside>，HTML5 规范说：

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

这有点难以解释，但我会说缩略图是文章内容的一个组成部分，而不是与之相切相关。

事实上，在没有数据的情况下，我根本不认为需要对<img>元素进行包装。只需使用：

<img src="abc.jpg" class="thumbnail" alt="A B C" />

如果您需要用于样式的包装器，请使用<div>

于 2012-07-14T11:53:55.900 回答
0

代码之间提到的元标记<head></head>...

<meta charset="utf-8">

正确的 html5 代码中的正确过程是......

<body><div class="container">
  <header>Header</header>
  <div class="sidebar1">
    <aside>
      <p>Paragraph</p>
      <p>Paragraph</p>
    </aside>
  <!-- end .sidebar1 --></div>
  <article class="content">
    <h1>Instructions</h1>
    <section>
     <p>Paragraph</p>
      <p>Paragraph</p>
      <p>Paragraph</p>
    </section>
  <!-- end .content --></article>

  <footer>Footer</footer>
  <!-- end .container --></div></body>

从中获得帮助...

而旁边是一个新的html5标签，用于页面的左侧或右侧...

CSS 放在一边：

aside {
    float: left;
    width: 180px;
    padding: 10px 0;
}
于 2012-07-14T10:01:59.207 回答
0

如果我在你的位置，我会编写如下代码：

<header>Heading</header>
<section class="article">

    <div class="meta"> date and author info. </div> 
    <article class="wrap">
        <div class="thumbnail"> <!-- left -->
            <img src="abc.jpg" />
        </div>        
        <aside class="content"> <!-- right -->
            ...
        </aside>  
    </article>
</section>
于 2012-07-14T10:03:31.887 回答