行内/块级/行内快元素 文本级标签: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; 和相邻行内元素在同一行,但是之间会有空白缝隙。 默认宽度是他本身内容的宽度。 宽度、高度、行高、外边距以及内边距都可以手动设置。 作者:啧啧泽 链接:https://juejin.cn/post/7063716262278496264 来源:稀土掘金 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。