block,inline-block,inline之间的区别

display的三种常用属性：block，inline-block,inline

block：此元素将显示为块级元素，此元素前后会带有换行符。

inline：默认。此元素会被显示为内联元素，元素前后没有换行符。

inline-block：行内块元素。（CSS2.1 新增的值）

block

1.块级元素的特点：

（1）元素独占一行，在未设置宽度时，其宽度随父容器的宽度

（2）可设置width，height，margin，padding属性

（3）可以容纳内联元素和其他块元素

2.常见的块级元素有：

◎ 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-block

inline-block比较特殊，它既有block的属性，也有inline的属性，简单来说就是将对象呈现为inline对象，但是对象的内容作为block对象呈现。但是这个属性目前不是所有的浏览器都支持，只有Opera和Safari支持，FireFox3和IE8据说将会支持，Firefox2和IE使用特殊办法可以实现这种效果。

inline

1.内联元素特点：

（1）一系列inline元素都在一行内显示，直到该行排满

（2）设置width,height属性无效，元素宽度随内容的多少而改变

（3）line-height、margin-top、margin-bottom设置无效

（4）只能容纳文本或者其他内联元素

2.常见内联元素

◎ 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 - 定义变量

（完）