学习精灵图心得

精灵图

优点：减少http请求，网页加载速度快，提高用户体验。

缺点：去要不断调整，不能随便改变大小和位置。

使用方法：

1：准备一张精灵图

 

 2：编辑HTML代码

 

 3：先给标签添加合适的代码 然后加入css精灵图片代码

 

 4：浏览效果

 

 

主要css样式：

font-weight: normal; 改变字体大小 不改变粗细 

display: inline-block;显示在一行 可以改变宽高 

background-repeat:no-repeat ; 不平铺显示 不重复

text-indent: 2em; em字体大小单位  首行缩进两个字体大小

background-position: center 5px; 改变图片位置