行内/块级/行内快元素

文本级标签：p , span , a , b , i , u , em

容器级标签：div , h1~h6 , li , dt ,dd

p：里面只能放文字和图片和表单元素，p里面不能放h和ul，也不能放p。

块级元素

• 霸占一行，不能与其他任何元素并列。
• 能接受宽高，如果不设置宽度，那么宽度将默认变为父级的100%

所有的容器级标签，都是块级元素，以及p标签。

容器级标签：div , h1~h6 , li , dt ,dd

文本级标签：p

行内元素

• 与其他行内元素并排
• 不能设置宽高，默认的宽度就是文字的宽度

除了p之外，所有的文本级标签，都是行内元素。p是个文本级标签，但是是个块级元素。

文本级标签： span , a , b , i , u , em

块级转行内

我们可以通过display属性将块级元素(比如div)和行内元素进行相互转换。

display：inline;

那么这个标签将变为行内元素，即：

1，此时这个div将不能设置宽度和高度了。

2，此时这个div可以和其他行内元素并排了。

行内转块级

display：block；

那么这个标签将变为块级标签，即：

1，此时这个span能够设置宽度，高度。

2，此时这个span必须独占一行，其他元素无法与之并排。

3，如果不设置宽度，将占满父级。

行内快元素

display:inline-block；

和相邻行内元素在同一行，但是之间会有空白缝隙。

默认宽度是他本身内容的宽度。

宽度、高度、行高、外边距以及内边距都可以手动设置。