天天看点

CSS 块级元素(块元素)和内联元素的区别

1.块级元素和内联元素

1.1块元素

  • 定义:独占一行的元素
  • 作用:主要用来布局
  • 详细:div、h1、p都是块级元素,块级元素独占一行

    ​ div没有任何语义,是一个纯粹的块元素。不会给嵌套在它里面的元素设置任何的默认样式。

    ​ p标签默认样式,上下会有间距。

    ​ h1标签默认样式,字体加大加粗。

    ​ div主要用来,对页面进行布局。

1.2内联元素(行内元素)

  • 定义:行内元素指的是只占自身大小的元素,不会占用一行的元素。
  • 作用:主要用来选中文本设置样式。
  • 详细:a span img iframe 这些标签都是内联元素

    ​ span标签没有任何语义,span标签专门用来选中文字,然后为文字设置样式。

  • 注意: 一般情况下,只使用块级元素包含内联元素,而不会使用内联元素去包含一个块级元素。

    ​ a元素可以包含任意元素,除了他本身。

    ​ p元素不可以包含任何其他的块元素(p元素是块级元素)