CSS图片问题字典，问题集

总结一下在前端遇到的一些图片不能显示，图片切图等相关问题，其实都是一些低级错误，但在工作中里遇上后，一着急就什么都忘记了，还把一些常用的工具都记下，方便以后使用。

1.css跟图片有依赖关系，就是说css的位置跟图片的路径要分清楚，要不然图片名字对了，css也没有语法错误，但是图片就是显示不出来。

比如你的目录是这样的，

css放在html文件里面，引入图片就是../images/1.jpg

而不是从html文件的目录去找，assets/images/1.jpg

2.如果你的背景图片是线上的地址，如果显示不出来，请加上引号，这样才能正确显示。

比如这样。可能显示不出来

background: url(http://www.baidu.com/1.jpg) no-repeat;

加上引号

background: url("http://www.baidu.com/1.jpg") no-repeat;

3.雪碧图合并
http://csssprites.com/
http://www.cnblogs.com/joyho/articles/3715260.html

4.切图

http://www.cnblogs.com/jingwhale/p/4396235.html

5.把黑色的Png图片还原

步骤：

1.新建3个图层

2.切换到通道选项卡，按住Ctrl点击红色通道，左侧会自动选中红色通道

3.切换到图层选项卡，点击一下图层1，点击下面类似阴阳的图标，选择纯色

4.打开纯色填充的界面，
这里注意，刚才我们选择的是红色通道，这里填充红色，绿色填充绿色，蓝色填充蓝色
R=Red红色、B=Blue蓝色、G=Green绿色

5.然后点图层1前面的小眼睛，熄灭它，点击一下其他图层，切换到通道选项卡

6.如此类推，然后选择“滤色”

7.然后透明的Png图片又出现了

6.怎么把有阴影的图片给切下来，比如有阴影的按钮，阴影的背景图？

要找到按钮所在的图层，可能是一个组可能是一个智能对象，把图层给合并了，然后你在按住ctrl键的时候，就能把之前选不中的阴影都给选中了，然后就可以给切下来了。