Css 的块级元素 和行内元素的区别

块级元素与行内的元素的区别

块级元素和行内元素是布局最基本的两种元素,我们都知道常见的块级元素有div,p,form,ul,li等,行内元素有span,strong,em等,对于这两者的区别,我也只是简单的了解了一番,要正真的理解及掌握,还得在不断的练习中深入体会。下面是他们的区别:

对于块级元素:

1.他会独占一行,在默认情况下,其宽度会自动填满其父元素的宽度;

2.块级元素可以设置width,height属性;

3.块级元素即使设置了宽度也是独占一行,块级元素可以设置margin,padding属性

对于行内元素:

1.行内元素不会独占一行,相邻的行内元素会排列在同一行里,直到行排不下,就自动换行,其宽度随内容而变化;

2.行内元素的width,height属性则无效;

3. 行内元素的margin、padding属性很奇怪,水平方向的padding-left、padding-rigtht、margin-left、padding-right都会产生边距效果,但是竖直方向的padding-top、padding-bottom、margin-top、margin-bottom却不产生边距效果。




你可能感兴趣的:(Css 的块级元素 和行内元素的区别)