行内元素对于Margin无响应：
行内元素不响应垂直方向的Margin属性，水平方向响应（这个或许就是行内的定义）。
建议：避免对行内元素使用Margin的所有属性，因为严格地来说是Margin是盒子模型的对外属性，是一个布局属性。如果一定需要实现左右缩进效果可以使用padding、文本缩进以及其他效果实现；
行内元素对于垂直方向Padding、Border拥有相应，但是响应不统一：
在IE9和火狐中，就有着截然不同的响应方式，更别说是IE的低端版本，因此绝对不使用行内元素垂直方向的Padding属性。Border也需要谨慎使用，绝大多数情况同样不推荐使用，宁愿不要边框效果，通过text-decoration属性去渲染这样就不会出现问题。
下面说下IE9和FF下对于上面的两个属性不同的响应方式。
在IE9下，这里吐槽下IE系列没有一个浏览器可以算的上好的浏览器，至少从5.5以后都是垃圾作品。
在IE9下，我仅仅针对只有一行的情况下进行讨论。假设是<p><a></a></p>的标签，此时a元素垂直方向的Padding和Border属性会对a元素在行高属性处理上产生影响。具体情况是这样的：
55555555.......研究数据丢失呀。回忆了一下，当时得出的结论是行内元素关于垂直方向的问题请使用line-height属性在处理，使用line-height属性时也请尽量确保该数值相较与font-size足够大（1.2倍应该足够）。另外，关于垂直方向的对齐可以通过base-line属性进行简单处理。
小结论：inline不响应垂直margin,padding（有但请避免）, width, height, max/min width/height 等属性声明。
正文：
block元素的特点：
* 总是另起一行开始；
* 高度，行高以及顶、底边距都可控制；
* 宽度缺省是它所在容器的100%，除非设定一个宽度。（100%是指撑满容器，因为考虑margin、padding元素宽度可能不到100%）
inline元素的特点：
* 和其它元素都在一行上；
* 高度(行高有影响，但是不影响盒子模型的content)以及顶、底边距不可改变；
* 宽度就是它所容纳的文字或图片的宽度，不可改变（自适应宽度，不可设定）。
块级元素的分类
块级元素按照其应用于结构还是内容分为三种：结构化块状元素，终端块状元素，多目标块状元素。
一.结构化块状元素
这类元素用于构造文档的结构，一个好的文档结构对于搜索引擎和应用其他技术都是十分有利的。它们没有语义上的含义，仅仅划分出了文档的组织方式，并没有体现文档的内容。
主要的结构化块状元素
<ol> 、<ul> 、<dl>、<table>
支持结构化的元素
<li>、<dt>、<dd>、<caption>、<thead>、<tbody>、<tfoot>、<colgroup>、<col>
二.终端块状元素
这类元素用于从结构转向内容，它们拥有语义上的含义，能够表明内容的性质。终端块状元素属于结构的终点，它们不能再包含其他块级元素，只能包含文本或行级元素。
终端块状元素
<h1>...<h6>、<p>、<blockquote>、<dt>、<address>、<caption>
三.多目标块状元素
所谓多目标指的是可自由的扩展或嵌套文档的结构，也可以终端的形式出现。当多目标块状元素以结构化的方式使用时就含有结构化的内涵，以终端的形式使用就含有语义的内涵。
多目标块状元素既可以包含块状元素，也可以包含内容（文本与行级元素的组合为内容），但不能同时包含两者（实现上其实是可以的，但是为了文档结构清晰，请确保两者没有同时包含，这个是推荐方式）。
多目标块状元素
<div>、<li>、<dd>、<td> 、<form>
XHTML块级元素有哪些呢？（常见的）
◎ address – 地址
◎ blockquote – 块引用
◎ dir – 目录列表
◎ div – 常用块级
◎ dl、ul、ol – 定义列表、非排序列表、排序表单
◎ fieldset – form控制组
◎ h1-6 – 大标题、副标题、 3-6级标题
◎ hr – 水平分隔线
◎ p – 段落
◎ pre – 格式化文本
◎ table – 表格
XHTML行内元素有哪些呢？ （常见的）
◎ a – 锚点
◎ abbr – 缩写
◎ b、i、u、em – 粗体、斜体、下划线、强调
◎ br – 换行
◎ cite – 引用
◎ img – 图片
◎ input – 输入框
◎ label – 表格标签
◎ select – 项目选择
◎ span – 常用内联容器，定义文本内区块
◎ textarea – 多行文本输入框
发表评论