文章目录
  1. 1. 块级元素
  2. 2. 行内元素
    1. 2.1. 行内替换元素
    2. 2.2. 行内非替换元素
  3. 3. 表元素|表单元素
  1. 块级元素
  2. 行内元素
    (1)行内替换元素
    (2)行内非替换元素
  3. 表|表单元素

块级元素

html, body

h1-h6
div
p

ul, ol, li
dl, dd

table, th, tr, td
form

blockquote
pre
fieldset
legend

说明:
width、height 有效

行内元素

行内替换元素

img
textarea
select

说明:

  1. width、height有效
  2. padding 也有效

行内非替换元素

a
em
span

说明:

  1. width 和 height,对其无效 【这点很重要】
  2. 水平3个属性:margin-left, width, margin-right
    外边距,也仅仅是影响了文本的起始位置,唯一的作用
  3. 垂直间距:能改变行间距的仅有3个:font-size, line-height, vertical-align
    而不是和水平相对应的那3个(height、margin-top、margin-bottom),需要用行高line-height
  4. padding:左右有效,但上下无效
  5. border 也完全不会影响到行高

表元素|表单元素

传说 [表元素:另当别论…. input, button, textarea]
input-radio
input-check

文章目录
  1. 1. 块级元素
  2. 2. 行内元素
    1. 2.1. 行内替换元素
    2. 2.2. 行内非替换元素
  3. 3. 表元素|表单元素