css基础组件库（兼容低版本）

1、图标跟文字混排
html

<div class="link">
    <span class="icon wyyx"></span>
    分享
</div>

css

.link{
    width: 92px;
    border: 1px solid #0f0;
    line-height: 18px;
}
.icon{
    display: inline-block;
    *zoom: 1;
    vertical-align: bottom;
}
.wyyx{
    width: 18px;
    height: 18px;
    background: url(http://p2.qhimg.com/t0116804ffa3cc8a59f.png) no-repeat;
}

截图：

注意：

父容器的line-height值与图标的高度相等，另保持设置图标的vertical-align的值为bottom。

2、上下垂直居中，需要兼容低版本的浏览器时用padding比用line-height要好很多。