发表于: 2019-06-02 21:54:48
3 1197
block 块级元素 inline 行内元素 inline-block 内联块元素
块级元素:<div><p><h1>-<h6><ul><ol><dl><li><dd><tabie><hr><blockquote><address><table><menu><pre>
HTML5新增的<headcr><section><aside><footer>等
行内元素:<span><img><a><lable><input><br><em><big><cite><i><q><textarea><select><small><sub><strong><u><buttom>等
内联块元素:<img><input>
区别:
block元素占一行(即使设置了width属性也一样是独占一行),宽度占满整个父元素,可以设置margin padding,width height.
block元素内可以包括inline元素和block元素,除了p标签只能包含inline元素
inline元素不换行,宽度有内容决定,只可以设置水平方向上margin padding 竖直方向不能设置(padding的4个方向都有效,margin
只有水平方向有效
inline-bolock元素 不换行,可以设置margin padding height width 由于会产生新的BFC(非块级元素的块级盒子),所以可以设置浮动
块级元素的width默认为100%,而内联元素则是根据其自身的内容或子元素来决定其宽度。
评论