内联元素跟块级元素来登记了
******* NO.1 块级元素 *******
【定义】即在视觉上被格式化为块的元素，
最明显的特征就是它默认在横向充满其父元素的内容区域，
而且在其左右两边没有其他元素，
也就是说块级元素默认是独占一行的。
【典型】典型的块级元素有：div p h1->h6等等。
通过CSS设定了浮动（float属性，可向左浮动或向右浮动）
以及设定显示（display）属性为“block”或“list-item”的元素都是块级元素。
但是浮动元素比较特殊，
由于浮动，其旁边可能会有其他元素的存在。
而“list-item”（列表项
-
），会在其前面生成圆点符号，或者数字序号。
******* NO.2 行内元素 *******
【特性】行内元素不形成新内容块，
即在其左右可以有其他元素，
【典型】a span strong 等，都是典型的行内级元素。
display属性等于“inline”的元素都是行内元素。
几乎所有的可替换元素都是行内元素，例如
img input 等等。
不过元素的类型也不是固定的，
通过设定CSS 的display属性，
可以使行内元素变为块级元素，
也可以让块级元素变为行内元素。
【block元素的特点：】
总是在新行上开始；
高度，行高以及顶和底边距都可控制；
宽度缺省是它的容器的100%，除非设定一个宽度。
【inline元素的特点：】
和其他元素都在一行上；
高，行高及顶和底边距不可改变；
宽度就是它的文字或图片的宽度，不可改变。
【详细了解它们的情况】
【块元素】(block element)一般是其他元素的容器元素，
块元素一般都从新行开始，
它可以容纳内联元素和其他块元素,常见块元素是段落标签'P"。
“form"这个块元素比较特殊，它只能用来容纳其他块元素。
如果没有css的作用，块元素会顺序以每次另起一行的方式一直往下排。
而有了css以后，我们可以改变这种html的默认布局模式，把块元素摆放到你想要的位置上去。
而不是每次都愚蠢的另起一行。
需要指出的是，table标签也是块元素的一种，
table based layout和 css based layout从一般使用者（不包括视力障碍者、盲人等）的角度来看这两种布局，
除了页面载入速度的差别外，没有其他的差别。
但是如果 普通使用者不经意点了查看页面源代码按钮后，两者所表现出来的差异就非常大了。
从这个角度来说，css layout code应该有更好的美学体验。
你能够把块容器元素div想象成一个剪贴文载。我们先把需要的文章从各种报纸、杂志总剪 下来。
每块剪下来的内容就是一个 block。
然后我们把这些纸块重新贴到一张空白的新纸上。
这样就形成了你自己独特的文摘快报了。
作为一种技术的延伸，网页布 局设计也遵循了同样的模式。
【内联元素】(inline element)一般都是基于语义级(semantic)的基本元素。
内联元素只能容纳文本或者其他内联元素，常见内联元素 “a”。
需要说明的是：inline element的中文叫法，
有多种内联元素、内嵌元素、行内元素、直进式元素。基本上没有统一的翻译，爱怎么叫怎么叫吧。
另外提到内联元素，我们会想到有个display的属性是display:inline;
这个属性能够修复著名的IE双倍浮动边界问题。
用display: inline 或display: block命令就可以改变一个元素的这一特性。什么时候需要改变这一属性呢？
*让一个inline元素从新行开始；
*让块元素和其他元素保持在一行上；
*控制inline元素的宽度（对导航条特别有用）；
*控制inline元素的高度；
*无须设定宽度即可为一个块元素设定与文字同宽的背景色。
我们完全可以把内联元素cite加上 display:block这样的属性，
让他也有每次都从新行开始的属性。
display:inline-block将对象呈递为内联对象，
但是对象的内容作为块对象呈递。
旁边的内联对象会被呈递在同一行内，允许空格。
inline-block的元素特点：
将对象呈递为内联对象，
但是对象的内容作为块对象呈递。
旁边的内联对象会被呈递在同一行内，允许空格。
(准确地说，应用此特性的元素呈现为内联对象，周围元素保持在同一行，但可以设置宽度和高度地块元素的属性)
并不是所有浏览器都支持此属性，
目前支持的浏览器有：Opera、Safari在IE中对内联元素使用display:inline-block，IE是不识别的，
但使用display:inline-block在IE下会触发layout，
从而使内联元素拥有了display:inline-block属性的表症。
从上面的这个分析，也不难理解为什么IE下，
对块元素设置display:inline-block属性无法实现inline-block的效果。
这时块元素仅仅是被display:inline-block触发了layout，
而它本就是行布局
，所以触发后，块元素依然还是行布局，
而不会如Opera中块元素呈递为内联对象。
【IE下块元素如何实现display:inline-block的效果？】
有两种方法：
1、先使用display:inline-block属性触发块元素，
然后再定义display:inline，
让块元素呈递为内联对象
（两个display要先后放在两个CSS声明中才有效果，这是IE的一个经典bug，如果先定义了display:inline-block，然后再将display设回inline或block，layout不会消失）。
代码如下
div {display:inline-block;...}
div {display:inline;}
2、直接让块元素设置为内联对象呈递（设置属性display:inline），
然后触发块元素的layout（如：zoom:1等）。代码如下：
div {display:inline; zoom:1;...}
可变元素是基于以上两者随环境而变化的，
它的基本概念就是他需要根据上下文关系确定该元素是块元素或者内联元素。
可变元素还是属于上述两种元素类别，
一旦上下文关系确定了他的类别，
他就要遵循块元素或者内联元素的规则限制。
【【【html标签的block、inline分类明细：】】】
【块元素(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 - 客户端脚本
本文参考自 http://blog.sina.com.cn/goupigao2000