对于块元素及行内元素及行内块元素的理解

HTML中的三类元素(个人见解,希望大佬多多指正,批评指正)

  • 1,块元素(block)
  • 例如:div,h1-h6,p,ul,li,ol等标签。
  • 特点:
  • 1,可设置宽高
  • 2,每个标签都会从新行开始
  • 3,没有设置宽高则会默认与容器同宽
  • 4,可以容纳内联元素和其他块元素。
    注意:p,h1-h6,dt中不可放置块元素。

2,行内元素(inline)
例如:a,strong,b,em,i,span等等,其中span为最典型行内元素。
特点:
1,不可设置宽高,但他们可以这是水平方向的padding值和margin值
2,新的元素会紧紧相邻,之间没有间隙
3,靠自身内容撑起
4,行内元素只容纳文本或其他行内元素

3行内块元素
例如:input,img,td
特点:
1,会与相邻元素在同一行,但之间有间隙
2,默认宽度为自身内容的宽度
3,高度,行高(line-height),内外边距都可设置

总结
以上三者之间可以通过display属性进行转换,在有display的情况下行内元素的宽高也就会生效。

猜你喜欢

转载自blog.csdn.net/qq_43174356/article/details/83003908