行级元素、块级元素、行级块元素

行级元素、块级元素、行级块元素

简单的介绍html标签元素

  • 行级元素
  • 块级元素
  • 行级块元素

行级元素特点及例子(inline)

  • 内容决定元素所占位置
  • 不可以通过css改变高宽
  • 例子:span strong em a del

块级元素特点及例子(block)

  • 独占一行
  • 可以通过css改变高宽
  • 例子:div p ul li ol form address

行级块元素(inline-block)

内容决定大小
- 可以通过css改变高宽
- 例子:img

这几个元素可以通过display属性来转换

元素 属性值
行级元素 inline
块级元素 block
行级块元素 inline-block

小知识

  • 凡是带有inline属性的,都带有文字特性,中间有空格的会出现4像素的距离。如:多个img标签一行一行的使用,会出现每张图片有4像素的距离
  • 可以通过css改变高宽
  • 例子:div p ul li ol form address

你可能感兴趣的:(行级元素、块级元素、行级块元素)