一、HTML元素的分类

01.块级元素(block)

• 常用元素： div、h1~h6、center、dir、dl、dt、form、hr、ol、p、table、ul ...
• 特点：
  • 独占一行
  • 可以设置宽高
  • 宽度默认是容器（父级元素宽度）的100%
  • 是一个容器及盒子，里面可以放行内或块级元素

02.行内元素（inline）

• 常用元素： a、i、strong、b、em、ins、del、s、u、span...
• 特点：
  • 不独占一行，一行可以显示多个
  • 宽和高直接设置是无效的
  • 默认宽度就是它本身内容的宽度
  • 行内元素只能容纳文本或其它行内元素
• 注意： 像img、video、等是可替换元素就可以设置宽高

03.行内块元素（inline-block）

• 特点：
  • 不独占一行，在同一行上，它们之间会有间隙，一行可以显示多个
  • 默认宽度就是它本身内容的宽度
  • 可以设置宽高
  • 同时具有块元素和行内元素的特点

二、嵌套规则

• 一般情况下，块级元素可以包含行内元素和其他块级元素
• 块级、行级块元素可以嵌套所有标签
• p标签不能嵌套块级元素
  • 如：p标签不能嵌套div
• 行级只能嵌套行级和文本
• a标签可以嵌套块级元素，但a标签不能嵌套自己
• h1~h6,dt这些标签的性质是标题，不能嵌套块级标签（可嵌套行内标签）
• 总结：
  • 必须遵守嵌套规则，如果在高级浏览器中它依然可以识别我们的html顺序，无关紧要
  • 在低级浏览器中会变成兄弟节点（例如：IE浏览器，严重的话可能会使整个布局乱掉）