再见阻止和内联-欢迎HTML5

HTML5 规范的创新有很多,其中许多已经得到大多数浏览器领域的支持 - 下面我想重点介绍嵌套元素规则的一个有趣的变化。 HTML 始终区分块元素和内联元素。例如,HTML4 的文档类型定义将 h1、p 和 div 列为块元素,将 a、span 和 img 列为内联元素。


现在已经放弃了这个概念(有充分的理由)。 在某些用例中,许多Web设计人员都忽略了上述嵌套规则的正确性,即嵌套元素内不得放置任何块元素,或者使用CSS规则(例如display:inline; 或显示:块; (通常会导致无效代码),事不宜迟。

HTML5现在正在简化这种区分,甚至命名一个元素可以属于的9个不同类别,从而一个元素可以处于多个类别。 块元素和内联元素之间的旧区别被抛在了后面,并考虑了Web上标签的多种含义。 特别地,这导致以下结构代表有效的代码:

<a href="#">
   <div>
      <h1>Yeah</h1>
      <p>
         Der ganze Block ist verlinkt.
      </p>
   </div>
</a>

以前只能使用技巧(例如通过链接的覆盖层的绝对定位)(使用有效代码)链接包含附加块元素的整个容器。或者,标题和段落是链接的 - 这反过来又导致冗余并且容器不可点击。感谢 HTML5 的欢迎扩展,这不再是问题。

背部