关于前端:行内元素与块级元素的特点及区别

5次阅读

共计 456 个字符,预计需要花费 2 分钟才能阅读完成。

1. 块级元素

 作用:搭建网页构造

特点:* 独占一行空间
* 默认宽度为 100%
* 高度由子元素或内容决定
* 能够通过 css 指定其宽度高度
* 块级元素能够蕴含块级与行内。

元素:html、body、div、p、h1~h6、ul->li、ol->li、dl->dd/dt、table、tr、th、td、hr、header、footer、nav、article、section、aside、address…

2. 行内元素

 作用:在构造中填充网页内容
特点:* 与其余行内元素共享一行空间
* 宽高由本身决定
* 因为不用来搭建网页构造,所以也无需通过 css 指定其宽度
* 行内元素中不能够嵌套块元素,行内相对来说,行内只能蕴含行内

元素:span、a、img、br、strong、b、i、em、sub、sup…

3. 块级行内的区别

    1. 块级独占一行,行内共享一行
    2. 块级能够间接设置宽高,而行内元素不行。(通过 css 的 display 属性,取值为 inline-block/block, 这样能够给行内设置宽高)
    3. 块级能够蕴含块级与行内,而行内只能蕴含行内

正文完
 0