精灵图生成器
上传多张图片，自动生成精灵图并获取对应的 CSS 和 HTML 代码
上传图片
图片预览
已选择: 0 张图片
暂无图片
精灵图
精灵图将在此处显示
代码输出
CSS代码将在此处显示
HTML代码将在此处显示
关于 CSS 精灵图
网页中存在大量小图标和图片时，每个元素都需单独向服务器发送请求，这不仅会增加服务器的负载压力，还会显著拖慢页面的加载速度。CSS 精灵图技术将多张图片合并为一张，在网页中通过 background 属性读取特定位置与尺寸的图像，从而减少 HTTP 请求次数，提升页面加载效率。
常见问题
图片会上传到服务器吗？
不会。多张图片在浏览器本地合并为精灵图，并生成 CSS/HTML 代码，不会上传到麻雀查服务器。
支持哪些图片格式？
支持 PNG、JPG、GIF 等常见图片格式，可一次选择或拖拽多张图片。
生成的 CSS 如何使用？
下载精灵图 PNG 后，将 CSS 中的 sprite.png 路径改为实际地址，再在 HTML 中使用对应 class 即可通过 background-position 显示各图标。