html区块元素

             大多数 HTML 元素被定义为块级元素内敛元素

  块级标签:会独占一行,无论内容多少

  内敛标签:根据内容多少占用空间大小

举例:

  块级:p、h1-h6、div、ul、li、ol、dl等

  内敛:span、img、i、b、a、em、icon(矢量标签)等

二者的区别

  块级

    1、块级元素会独占一行

    2、块级标签可以设置宽高

  内敛

    1、内敛不会独占一行

    2、内敛不可以设置宽高

    3、内敛元素的margin上下边距不起作用

(注:相邻两个块级元素同时设置margin时,他们之间的外边距不会叠加,会取最大值 。这种现象叫margin塌陷)

二者转换

  块级转行级

    给块级元素添加属性display:inline;(display 显示,inline 行) 

  行级转块级

    给行级元素添加属性display:block;(block 块)

  行级块元素

    给需要的元素添加属性display:inline-block;

备注:line-height  行高    设置字体的垂直位置         line-height的值和height的值相同   文本就上下居中)

 

  

 

 

 

 

 

 

 

 

 

 

 

 

 

 

    

posted @ 2018-09-13 19:43  枯桑  阅读(823)  评论(0编辑  收藏  举报