关于此工具
使用 CSS 背景生成器创建
预览图片定位、尺寸、重复和渐变叠加，然后复制匹配的 CSS。
上传本地图片以预览覆盖、包含、定位、重复和叠加。单独设置已发布的资源路径；生成的 CSS 使用该路径，不会嵌入或上传源文件。
CSS 背景生成器
预览图片定位、尺寸、重复和渐变叠加，然后复制匹配的 CSS。
在你的设备上运行 无需注册
本地开发者工具
使用方法
- 01
准备您的源文件
选择支持的源图片，或在工具提供时从文本模板开始。
- 02
调整结果
上传本地图片以预览覆盖、包含、定位、重复和叠加。单独设置已发布的资源路径；生成的 CSS 使用该路径，不会嵌入或上传源文件。
- 03
查看并下载
检查完整的预览和输出设置。下载完成的资源，同时保留原始文件以供对比。
获得更好结果的技巧
- 本地预览使用您选择的文件。您的网站需要托管资源或项目中的路径。在那里上传或复制图片，并确保 CSS 路径从您的样式表中解析。
- 在检查结果之前保留原始文件。
- 在预期的显示尺寸下检查小文本和精细边缘。
- 图像处理在您的浏览器中进行。关闭标签页前请下载结果。该工具不会覆盖您的原始文件。
常见问题
如何使用 CSS 背景生成器？ +
选择支持的源图片，或在工具提供时从文本模板开始。上传本地图片以预览覆盖、包含、定位、重复和叠加。单独设置已发布的资源路径；生成的 CSS 使用该路径，不会嵌入或上传源文件。
为什么复制的 CSS 需要图片路径？ +
本地预览使用您选择的文件。您的网站需要托管资源或项目中的路径。在那里上传或复制图片，并确保 CSS 路径从您的样式表中解析。
我的输入在哪里处理？ +
图像处理在您的浏览器中进行。关闭标签页前请下载结果。该工具不会覆盖您的原始文件。
我可以使用哪些文件？ +
接受的输入：JPG、PNG、WebP、AVIF、GIF。可用输出：TXT。浏览器解码支持和所选输出设置决定了哪些源文件可以被处理。
需要账户吗？ +
此工具无需账户。您可以在保存到设备前查看输出结果。