时间戳

首页 > 解决方案 > 有很多嵌套元素不好吗？

html - 有很多嵌套元素不好吗？

问题描述

<!-- beginning of main-container  -->
<div class="main-container">
  <main>
    <section>
      <h3>Featured Stories</h3>
      <figure>
        <a href="#"><img src="bird-story.jpg" alt="A red-flanked bluetail roosting on the grounds of Library" title="A red-flanked bluetail roosting on the grounds of Library" /></a>
        <footer>
          <a href="#"><h4>Rare bird attracts crowds</h4></a>
          <figcaption>A red&dash;flanked bluetail roosting on the grounds of Library is popular with birders&period;</figcaption>
        </footer>
      </figure>
    </section>
  </main>
</div>
<!-- end of main-header -->

我读到 HTML 应该是语义含义，您应该描述内容的含义而不是它的外观。大家觉得我过分了吗？有时，当我尝试设计它时，它会让我感到困惑。

标签： htmlcss

解决方案

嵌套元素太多也不错。不好的是有太多不必要的元素。拥有不必要的元素会增加你的 DOM，如果执行的话，会减慢 DOM 操作过程。

在您的 html 中，

  • 如果main中只有 1 个部分，您可以删除您的部分标签。

  • 在a中包装h4是无效的 html wrt 语义（inline-block 元素中的块级元素）。应该以其他方式使用它（a inside h4）

  • 页脚标签也可以省略。但同样，这取决于您希望对figcaption wrt seo有多少关注。

绝对没有这样的规则，只是在编写 HTML 时要有一个视角。

推荐阅读