2.0 KiB
2.0 KiB
title | localeTitle |
---|---|
Block and Inline Elements | 块和内联元素 |
块和内联元素
让我们使用以下示例来理解它们:
带输出的代码示例:
块级元素:
块级元素占据父级(容器)的整个空间,例如示例中的<div>
和<p>
。
请注意, <div>
和<p>
每次都从一个新行开始,形成一个块状结构。块级元素从新行开始。
常见的块级元素是<div>
, <p>
, <article>
, <section>
, <figure>
, <footer>
等。
内联元素:
内联名称“作为正文的一部分而不是单独的部分”。内联元素在主元素定义的空间内根据需要占据空间。与块级元素不同,它们不会在新行上开始。
一些内联元素是<a>
, <span>
, <img>
, <code>
, <cite>
, <button>
, <input>
等。
带输出的代码示例:
注意 :块级元素可能包含其他块级元素或内联元素。内联元素不能包含块级元素。
HTML5中的更改
虽然对块和内联元素的理解仍然相关,但您应该知道这些术语是在HTML规范的早期版本中定义的。在HTML5中,一组更复杂的“内容类别”替换了块级和内联元素。块级元素主要放在HTML5中的“流内容”类别中,而内联元素对应于“短语内容”类别。有关HTML5中新内容类别的更多信息,包括流内容和短语内容,请参阅Mozilla开发人员网络上的 “ 内容类别”页面。
更多信息:
请参阅Mozilla文档