block（块级元素）和 inline（内联元素） 的区别

div这样的块级元素，就会自动占据一定矩形空间，可以通过设置高度、宽度、内外边距等属性，来调整的这个矩形的样子；

与之相反，

像“span”这样的行内元素，则没有自己的独立空间，它是依附于其他块级元素存在的，因此，对行内元素设置高度、宽度、内外边距等属性，都是无效的。

其实你需要知道的行内元素就是 span 和 a ，其他的行内元素，比如 strong、b、font 这些都是以前在HTML中用来设定文字样式的标记，而使用CSS以后，这些标记应该都不用了，所以知道它们没有什么用，弄不好反而让初学者混淆了一些概念。

block表现出来的特点是折行的. inline表现出来是不换行的. 但如果给一个元素加入了浮动(float)的话.他们就会排在一行,按自然顺序.不管是block还是inline定义了浮动之后,可以定义高度,宽度. inline单独存在的条件下是定义不了宽度高度的.block可以.

例如： a正常情况下是不能定义高度的。宽度倒是可以定义，但是对鼠标有反应的只有文字部分 如果加上display:block的话，高度可以定义，但是不在一行了，整个块对鼠标都有反应了 如果加上float:left的话，能定义高宽，整块对鼠标有反应 但是 它是横向菜单，

       所有允许被 BODY 元素包含的元素，要么是块级的；要么是内联的；要么既可以算作块级的，也可以算作内联的。但是绝对不存在一个能被BODY包含，但即非块级，又非内联的元素。
     
       常见的块级元素有 DIV, FORM, TABLE, P, PRE, H1~H6, DL, OL, UL 等等。
       常见的内联元素有 SPAN, A, STRONG, EM, LABEL, INPUT, SELECT, TEXTAREA, IMG, BR 等等。
       另外，SCRIPT, OBJECT, MAP, BUTTON, DEL, INS 这些元素，既可以作为块级元素，也可以作为内联元素。

    一般来说块级元素可以包含块级元素和内联元素；
    但内联元素只能包含内联元素。
    要注意的是，每个特定的元素，能包含的元素也是特定的，所以具体到个别元素上，这条规律是不适用的。
    比如 P 元素，只能包含内联元素，而不能包含块级元素。

块元素(block element)

一般是其他元素的容器元素，块元素一般都从新行开始，它可以容纳内联元素和其他块元素,常见块元素是段落标签'P。"form"这个块元素比较特殊，它只能用来容纳其他块元素。

内联元素(inline element)

一般都是基于语义级(semantic)的基本元素。内联元素只能容纳文本或者其他内联元素，常见内联元素"a"。     ps:关于inline element的中文叫法，有多种内联元素、内嵌元素、行内元素、直进式元素。         另外提到内联元素，我们会想到有个display的属性是display:inline;这个属性能够修复著名的IE双倍浮动边界问题。

 

可变元素

需要根据上下文关系确定该元素是块元素或者内联元素。可变元素还是属于上述两种元素类别，一旦上下文关系确定了他的类别，他就要遵循块元素或者内联元素的规则限制。

块元素(block element)
*  address  -  地址
*  blockquote  -  块引用
*  center  -  举中对齐块
*  dir  -  目录列表
*  div  -  常用块级容易，也是css  layout的主要标签
*  dl  -  定义列表
*  fieldset  -  form控制组
*  form  -  交互表单
*  h1  -  大标题
*  h2  -  副标题
*  h3  -  3级标题
*  h4  -  4级标题
*  h5  -  5级标题
*  h6  -  6级标题
*  hr  -  水平分隔线
*  isindex  -  input  prompt
*  menu  -  菜单列表
*  noframes  -  frames可选内容，（对于不支持frame的浏览器显示此区块内容
*  noscript  -  ）可选脚本内容（对于不支持script的浏览器显示此内容）
*  ol  -  排序表单
*  p  -  段落
*  pre  -  格式化文本
*  table  -  表格
*  ul  -  非排序列表

内联元素(inline element)
*  a  -  锚点
*  abbr  -  缩写
*  acronym  -  首字
*  b  -  粗体(不推荐)
*  bdo  -  bidi  override
*  big  -  大字体
*  br  -  换行
*  cite  -  引用
*  code  -  计算机代码(在引用源码的时候需要)
*  dfn  -  定义字段
*  em  -  强调
*  font  -  字体设定(不推荐)
*  i  -  斜体
*  img  -  图片
*  input  -  输入框
*  kbd  -  定义键盘文本
*  label  -  表格标签
*  q  -  短引用
*  s  -  中划线(不推荐)
*  samp  -  定义范例计算机代码
*  select  -  项目选择
*  small  -  小字体文本
*  span  -  常用内联容器，定义文本内区块
*  strike  -  中划线
*  strong  -  粗体强调
*  sub  -  下标
*  sup  -  上标
*  textarea  -  多行文本输入框
*  tt  -  电传文本
*  u  -  下划线
*  var  -  定义变量

可变元素
可变元素为根据上下文语境决定该元素为块元素或者内联元素。
*  applet  -  java  applet
*  button  -  按钮
*  del  -  删除文本
*  iframe  -  inline  frame
*  ins  -  插入的文本
*  map  -  图片区块(map)
*  object  -  object对象
*  script  -  客户端脚本