inline、block、inline-block元素

2018-11-28 11:13:03
linefo
416
最后编辑:linefo 于 2018-11-28 11:48:04


一、inline(内联)元素


(1)不会独占一行,多个相邻的行内元素会排列在同一行里,直到一行排列不瞎,才会新换一行

(2)其width(宽度)随元素的内容而变化

(3)设置width、height无效,而设置margin、padding只在水平方向有效。


二、block(块级)元素


(1)会独占一行

(2)默认情况下,block元素width(宽度)自动填满父级元素的宽度

(3)width、height、margin、padding属性均有效。


三、inline-block


这个稍微解释一下,简单来说就是将对象呈现为inline对象,但是对象的内容作为block对象呈现。使其既具有block的宽度高度等特性,又具有inline的同行特性。


四、常见元素分类


(1)inline元素

a,span,br,i,em,strong,label,q


(2)block元素

p,h1...h6,ol,ul,dl,table,address,blockquote,form


(3)inline-block元素

img,input