ps切图详解以及上传至蓝湖

介绍

我是一名前端开发工程师,随着工作环境的改变,遇到过公司没有ui设计师,或者ui设计师只为我提供psd设计稿,并没有切好图。由此可以看出会一些切图技巧对我们开发效率还是起着至关重要的作用。
下边分享一下这方面我的经验,希望帮助到你。

普通切片切图

  1. 首先打卡ps软件 ctrl+p调出标尺,单位选择像素,红色区域分别是垂直和水平的参考线,直接拉动几根将我们需要切的图包裹住。
    在这里插入图片描述
    2.打开切片工具,沿着参考线选取我们想要的切片,同养的操作我们可以选择多张切片。
    在这里插入图片描述
    3.接下来就是保存我们所要的切图了,旧版本的ps点击文件存储为web所用格式,新版本的要选择导出,然后选择存储为web所用格式。
    在这里插入图片描述
    在这里插入图片描述
    4.接下来选择png-24,透明,选择保存选中的切片到对应的路径就行了
    在这里插入图片描述
    在这里插入图片描述

选择图层切图

1.新建一个空的文件(背景最好选择透明)
2.右键psd文件查看对应的图层,然后拖拽到新建的文件中
在这里插入图片描述
在这里插入图片描述
3.接下来要选择导出,导出路径格式,运行即可
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

接下来是强烈推荐的上传蓝湖切图方式

  1. 使用蓝湖必须要用较新版本的ps软件,还有对应的蓝湖插件,网上可以搜索到教程,就不详细说明啦。
  2. 鼠标左键选择对应的图层,按住ctrl键可以选择多张,然后标记为切图
    在这里插入图片描述
    3.选择web格式,对应尺寸,然后上传psd文件到你的蓝湖目录下面即可
    在这里插入图片描述
    4.登录蓝湖查看,下载我们标记好的切图文件。
    在这里插入图片描述

小结

编辑不易,转载请注明出处。感谢赏阅,期待你的建议,点赞和关注。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值