PSpriter之CSS Sprites 进入全屏
line

PSpriter一开始的目标,就是这个:Css Sprites。

简介:

/**
* 在CSS中,将小图合并,并用大图替换原来的小图,修正或添加background-position
*
* 1、如果background-repeat:repeat | repeat-x | repeat-y
*           则不进行小图合并
* 2、如果background-position:right bottom 或 x、y其中一个为center
*           则不进行小图合并
* 3、如果background-position:left bottom 或 -10px bottom
*           则进行水平方向合并,并将小图底对齐,保留bottom定位,修正position-x
* 4、如果background-position:right top 或 right -10px
*           则进行垂直方向合并,并将小图右对齐,保留right定位,修正position-y
* 5、如果background-position:left top 或 -10px -10px等
*           则进行混合模式合并,同时修正position-x和position-y
* 6、强制不进行图片合并的,可以在图片后加参数:sprite=0
*           backgrouond:url(/static/qbase/img/icon.png?sprite=0) no-repeat;    
*
* @remark
*           如果要使用CSS Sprites功能,必须保证在你的CSS中所有背景图片都是未经过合并的小图
*        
* @example
*           // 导入类库
*           include_once('CssSprites.class.php');
*           // 需要进行布局的矩阵列
*           $cssfiles = array(
*                   array(
*                        'css' => '/home/zhaoxianlie/pspriter/css/index.css',
*                        'cfg' => array(
*                             'type' => 'png,gif',
*                             'margin' => 5
*                        )
*                   )
*               );
*           // 布局所需配置
*           $options = array(
*                   'output' => '大图输出目录,如果未指定,会默认为:/img/sprite'
*                );
*           // 创建图片合并的实例
*           $csssprites_instance = new CssSprites();
*           // 图片合并
*           $csssprites_instance->run($cssfiles,$options);
*          
*          
* @author zhaoxianlie (admin@baidufe.com)
*
*/
阿里巴巴-钉钉-开放平台,能力开放&开发者运营岗位招聘中, 期待你的加入!
钉钉开放,让应用开发更简单
充分开放,是钉钉的重要方向!除致力于为开发者打造丰富的开放API, 更易接入的场景化能力包, 完备的应用开发工具之外, 还需要持续构建开放能力的布道、开发者生态运营体系,包括培训、沙龙、大会、社区合作等等。业务在快速发展,我们也还需要更多优秀的小伙伴加入!

评论区域

line