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

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接： https://blog.csdn.net/weixin_45794767/article/details/102762716

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

块级元素
1、多个元素存在一行
2、对宽高不生效

代表元素有：div、p、h1~h6、ul、li、dl、dt、dd、ol、table、td、th、tr、address、caption、field、form、hr、legend、noframes、noscripts、pre、tbody、tfoot、thead

行内元素
1、独占一行
2、对宽高生效

代表元素有：span、font、b、u、i、strong、em、a、br、abbr、label、samp、select、small、sub、sup、textare、tt、var

行内块元素
1、多个元素存在一行
2、对宽高生效

代表元素有：img、input

块级元素、行内元素、行内块元素的转换模式

display:block;//行内转为块级元素
display:inline;//块内转为行内元素
display:inline-block;//行内转为行内块元素