margin:负值 也挺有用

css中一些属性设置成 负值可以得到不一样的效果。

如：

• background-position: 负值 成就了 css sprite 雪碧图。
• text-indent: 负值 实现链接文字隐藏, 当然这个在未来不推荐使用了哈，有点影响读屏器

首先定义一下margin。
margin定义盒模型的外边距

margin的一些特性

• first-child 的 margin-top 值会穿透给上一层
• last-child 的 margin-bottom 会无效
• 同级间的 margin-top bottom 会合并.

当然一些IE低端浏览器可能会有不一样的表现 >///< 没仔细测过

使用负margin使icon同文字水平剧中

平常做一个icon 16x16需要跟文案的行文字水平剧中对齐，需要用到vertical-align: middle

当然这个时候要给icon配上display:inline-block，这样可以给icon设置宽高。
但是 vertical-align: middle 的时候icon下方会有4px的 baseline空隙，这个时候看起来会对不齐。具体可以看[vertical-align]的定义。

所以这个时候需要使用 margin 负值来调节上下偏移。

阻止浮动元素换行

这个我挺喜欢，有的时候因为浮动元素的宽度问题，导致不必要的换行。可以用margin 负值来搞掂。

flaoat:left; margin-right:-10px;

另外在ul>li 的 结构中也可以用margin 负值来阻止换行，
比如你为了实现float的li间距，以及ul两侧的空隙相等，这个时候如果外围dom两侧本身有padding了。
那么li中的 margin-right 属性就会给右侧多出一些空隙，
这个时候 ul 弄一个 margin-right:负值 会有神奇的效果。