你的位置:首页 > 软件开发 > 网页设计 > (三)Sass和Compass

(三)Sass和Compass

发布时间:2015-05-20 12:00:29
6.1 精灵的工作原理// 将各种图片合并到一张图片里面,并在不同的状态下改变背景图片的位置; 6.2 精灵的重要性// 压缩图片的内存;// 减少HTTP请求6.2.3 Compass处理精灵方案// 1.让Compass指向一个精灵的文件夹;// 2.告诉Compass撰 ...

(三)Sass和Compass

6.1 精灵的工作原理

// 将各种图片合并到一张图片里面,并在不同的状态下改变背景图片的位置;

 

6.2 精灵的重要性

// 压缩图片的内存;

// 减少HTTP请求

6.2.3 Compass处理精灵方案

// 1.让Compass指向一个精灵的文件夹;

// 2.告诉Compass撰写精灵CSS;

// 3.编译样式表;

 

6.3 用Compass制作精灵

 6.3.1 创建一个精灵地图

1 @import "compass/utilities/sprites";  // 精灵图片控件;2 @import "Icon/*.png";          // Icon文件夹位于images文件夹内并包含所有精灵图片;3 4 // 生成精灵图片位于images文件夹内;并生成编译后的CSS;5 CSS:6   .Icon-sprite {             // 自动生成的类命名; 7    background-image: url('/images/Icon-s040daee5af.png');8    background-repeat: no-repeat;9   }

原标题:(三)Sass和Compass

关键词:

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录