CSS块级标签与行内标签的区别

转载 · 小橙奶茶 · 2023-08-04 · 原文

块级标签占满行 行内标签会按照顺序从左到右依次排列

块级标签:h1-h6 p ul ol li div table dl form

行内标签:span a br lable I em

块级元素的特点:display:block

  • 每个块都是从新的一行开始,后面的元素会另起一行
  • 元素的宽度、高度、行高、内外边距都是可设置的
  • 如果不设置元素的宽度,是他父容器的100%,除非你给他设定高度

行内元素的特点:display:inline

  • 和其他的元素都在一行上
  • 不能设置元素的宽度,高度,行高,内外边距
  • 元素的宽度是他包含文字或图片的宽度,不能改变

行内块元素的特点:display:inline-block

  • 和其他的元素都在一行上
  • 宽度,高度,行高,内外边距都可以设置的