累啊

Margin的塌陷现象是什么?

 

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

5.有的标签设置背景时会独占一行,还有的会随着内容的增减而改变自己的空间大小

根据以上现象,标签又分

 

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

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

二者区别

块级

1,块级元素会独占一行

2,块级可以设置宽高

内敛

1,内敛不会独占一行

2,内敛不可以设置宽高

3,内敛元素的margin上下不起作用了

二者转换

块级转行级

块级元素添加属性display:inline; display 显示  inline

行级转块级

行级元素添加属性display:block;    block

行级块元素

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

(可以设置宽高了,可以在一行了,margin可以随便使用了)

备注

Line-height 行高  设置字体的垂直位置

 

Line-height的值和height的值相同 文本就上下居中

拓展 line-height:50px/2;

当是2的时候  line-height的值是2*font-size的大小==36px

 

posted @ 2018-09-13 19:32  前端1大神  阅读(131)  评论(0编辑  收藏  举报