Question

我想知道一起使用HTML5和div标签的最佳方式。我在下面发布了我的HTML 我正在使用article代码，然后我有一些我确定正确的部分，但我也在使用网格，那么我应该在哪里放置网格 div？<登记/> 我的方法是最好的方法吗？

<article>
  <div class="grid-wrapper">
    <section>
      <div class="grid-4-col">
        <h1>Welcome Back</h1>
       <p>It has been a while. What have you been up to lately?</p>
   </div>
</section>

<section>
  <div class="grid-4-col">
    <h1>Welcome Back</h1>
    <p>It has been a while. What have you been up to lately?</p>
  </div>
</section>

<section>
  <div class="grid-4-col">
    <h1>Welcome Back</h1>
    <p>It has been a while. What have you been up to lately?</p>
  </div>
</section>

<section>
  <div class="grid-4-col grid-last">
    <h3>Chicago</h3>
    <h5 hidden>City in Illinois</h5>
    <img src="chicago.jpg" alt="Chicago, the third most populous city in the United States">
    <ul>
      <li>234 square miles</li>
      <li>2.715 million residents</li>
    </ul>
  </div>
</section>
</div>
</article>

Answer 1

根据HTML5Doctor的说法，你的方式很好。您有效地使用div作为包装并且允许使用。

来源：http://html5doctor.com/you-can-still-use-div/

Answer 2

由于您正在使用网格系统，并且截面元素将内容分开，因此您希望该部分位于网格内，该网格由div定义。所以把section元素放在div中。否则，您的网格是相对于该部分而不是整个页面和网格系统。

HTML和div的最佳实践

2 个答案: