元素的显示模式

 

1.块级元素

特点:

        1. 独占一行 
        2. 宽度默认是父元素的宽度,高度由内容撑开.
        3. 可以设置宽高
        代表性的标签 div h系列 p li 

2.行内元素

特点
         1. 一行可以显示多个,如果一行装不下自动折行(换行显示)
         2. 宽度和高度默认由内容撑开
         3. 设置宽高无效
         代表性的标签 a span em strong

3.行内块元素

行内块元素特点
         1. 一行显示多个
         2. 可以设置宽高
          代表性标签 input button

注意:img同时具有块元素,和行内块元素的特点,但是img是替换元素

        具体请看https://baijiahao.baidu.com/s?id=1685422640129488937&wfr=spider&for=pc

元素显示模式转换

转换为块级元素
display: block;
转换为行内块元素
display: inline-block;
转换为行内元素
display: inline