天天看点

css块级元素变行内元素,css块级元素和行内元素

块级元素:

1.display为block

2.会独占一行,导致换行

3.可以设置宽高

4.margin外边距设置都有效

5.padding内填充都有效

6.可以容纳行内元素和块级元素,也可以容纳内联元素和其他元素

7.两者可以通过display来互相转换

8.举例:div  p  h1-h6  table  form  ul  ol  dl  等等

行内元素:

1.display为inline

2.会与其他元素排列在一行上

3.不可设置宽高

4.设置margin外边距,上下外边距设置无效,左右外边距设置有效

5.padding内填充上下无效,左右有效

6.不能包含块级元素,只能容纳文本或其他行内元素

7.两者可以通过display来互相转换

8.举例:span  img  em  strong  a  select  label  br  input  等等

拓展:行内块元素

1.会与其他元素排列在一行上

2.margin外边距设置都有效

3.padding内填充都有效

4.简单的理解就是没有块级元素中第2个特点的块级元素

标签:块级,行内,元素,padding,设置,display,css

来源: https://www.cnblogs.com/FranceCG/p/15000798.html