小编gae*_*ner的帖子

当然有几个关于正确使用html5 <figure>元素的讨论和问题,但没有一个对我的问题有特定的答案.

这是关于显示投资组合项目的一般性问题.当然,你可以这样做:

<ul>
  <li>
    <h1>Project Title</h1>
    <img src="#"/>
    <p>a short description</p>
  </li>
</ul>

要么

<div class="portfolio-item">
  <h1>Project Title</h1>
  <img src="#"/>
  <p>a short description</p>
</div>

当然,还有其他十几个方式来描述一个单一的项目,但我想知道,如果这将是有效的和语义 HTML5,如果你整个包住项目到<文章>元素,并把图片放到一个<人物>元素.考虑以下示例

<article class="portfolio-item">
  <h1>Project Title</h1>
  <figure>
    <img src="#">
    <figcaption>a short description</figcaption>
  </figure>
  <a href="#"> View details</a>
</article>

如果没有,那么显示它们的最具语义的方式是什么？