大家是用什么方式生成 CSS sprites 的?-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文

大家是用什么方式生成 CSS sprites 的?

2016-03-25 14:14:29 1771 1

公司原先是手动合并的, 一个是效率低, 前端和美工工作都比较麻烦,
另一个是图片位置通过手工调整难以保证位置完全正确..
然后我做了两次尝试

Spritesmith
用了 Grunt 插件, 可以定义 CSS 模版. 合并基本是完成.
问题是不支持 Retina, 每次合并又不一样, 比较麻烦.

glue
解决了 Retina 合并的问题, 但是有两个问题,
一个定制性, Grunt 插件文档不清晰, 另外生成的 CSS 可能需要手工定制.
致命的是 Retina 生成的小图片图标质量不过关,
据说说 0.9 可以解决, 但需要手动安装, 我现在还没有尝试.

后面也开始找其他方案,

有推荐 peach, 但文档稍微找了下还没弄明白,
又有找 Fireworks 插件导出 CSS, 目前不熟悉工具也没有尝试..

不知道大家试过的方案有哪些好的?

可能要考虑进去的问题

Grunt 支持或者其他的脚本支持
CDN 部署的文件名和直接合并的不一致, 可能用模版去解决
Retina 的支持, 能生成 backgroupd-position.
Retina 下自动缩放图片而且保持清晰度
工具需要跨平台, 在 OS X 和 Windows 上进行使用

取消 提交回答
全部回答(1)
  • a123456678
    2019-07-17 19:14:15

    1.用Fireworks哦~~然后存储以后所有小组件图片都是分离存储在一起的fw.png文件,记得给小组件写position信息存到.txt文档里面,以后维护很方便。
    2.然后PS打开一次打开一次这个文件再另存为另外一个文件夹路径中就可以变成普通整套组件一整张的小体积的.png了。
    3.然后把小体积的上线,大体积的留档以后编辑。

    0 0
相关问答

1

回答

Spring中AOP是什么呢?

2022-03-31 23:01:51 147浏览量 回答数 1

1

回答

使用 spring 实现 aop的代码如何编写?

2022-03-31 20:20:46 108浏览量 回答数 1

1

回答

CSS sprites的原理是什么啊?

2021-12-14 17:15:09 641浏览量 回答数 1

1

回答

Spring REST Docs是什么?

2021-12-23 17:25:11 206浏览量 回答数 1

1

回答

使用Spark读写OSS文件示例代码(以Scala为例)是什么?

2021-12-09 20:03:43 508浏览量 回答数 1

1

回答

Spring Data REST是什么呢?

2021-10-25 16:52:06 209浏览量 回答数 1

1

回答

Spark3 Richer APIs是什么?

2020-12-28 11:15:00 175浏览量 回答数 1

1

回答

spring-data-jpa中使用泛型JpaRepository<T,I?报错

2020-06-14 17:17:52 692浏览量 回答数 1

1

回答

css sprite 是什么,有什么优缺点

2019-11-18 15:40:05 996浏览量 回答数 1

1

回答

Spring AOP 切 dwr的问题

2016-03-16 11:49:02 2056浏览量 回答数 1
+关注
0
文章
14879
问答
问答排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载