为了账号安全,请及时绑定邮箱和手机立即绑定

前端工程师必备的PS技能——切图篇

  • 编辑→首选项→增效工具→启动生成器
    查看全部
  • 步骤:1.视图/显示/智能参考线以及视图/字符,这两个都要选上; 2.窗口/信息;窗口/字符,两个打开,其他的多余的可不需要,将前面的勾取消; 3.点击信息面板那一个小三角,打开面板选项/标尺单位:像素;两个像素模式:RGB颜色;文档尺寸选上,然后确定; 4.编辑/首选项/单位与标尺【标尺:像素;文字:像素,其他默认不用改动】 这样的做的好处:在PS里打开一个网页,随便点击哪个图片或者某个字符,就可以知道详细的信息。 5.窗口/工作区/新建工作区/名称:web切除,后两个选上,然后点击存储,这样就可以保存下来,防止丢失了
    查看全部
  • 学习目标: 1、能够自己使用photoshop从网页设计师提供的psd中获取网页前端开发过程中所需要的资源。 2、对photoshop操作有一个基本的了解。 3、可以做一些简单的图片处理和调整。 4、提高自己的审美及其美感的培养。
    查看全部
  • 颜色填充: 前景色:alt+delete 背景色:ctrl+delete
    查看全部
  • 放大镜: 缩小:Alt H+鼠标左键:先把图层缩小,鼠标移到相应位置再放开可以放大这个位置
    查看全部
  • 传统切图 1 切片: a 裁剪工具-切片: 手动一个一个切所需的图片。 b 先拉好参考线,裁剪工具-切片-基于参考线的切片,切好后删除不需要的切片。 c 先裁剪,再切。 2 导出切片图片: “文件-导出为web所用格式”, 常保存为:PNG-24
    查看全部
    0 采集 收起 来源:PS传统切图

    2017-07-21

  • ctrl+r显示或者隐藏标尺 alt可以改变参考线的方向 新建参考线的快捷键: alt+v+e可以快速新建垂直参考 alt+v+h可以快速新建垂直参考线 参考线隐藏ctrl+; ,重新打开ctrl+;
    查看全部
  • 精准切图”:文件-脚本-将图层导出到文件-文件类型选择PNG24,将透明区域,交错,裁切图层勾上-运行。
    查看全部
    0 采集 收起 来源:PS精准切图

    2017-07-21

  • 步骤:1.视图/显示/智能参考线以及视图/标尺,这两个都要选上; 2.窗口/信息,窗口/字符,窗口/图层;窗口/历史记录4个打开,其他的多余的可不需要,将前面的勾取消; 3.点击信息面板那一个小三角,打开面板选项/标尺单位:像素;两个像素模式:RGB颜色;文档尺寸选上,然后确定; 4.编辑/首选项/单位与标尺【标尺:像素;文字:像素,其他默认不用改动】 这样的做的好处:在PS里打开一个网页,随便点击哪个图片或者某个字符,就可以知道详细的信息。 5.窗口/工作区/新建工作区/名称:web切图,后两个选上,然后点击存储,这样就可以保存下来,防止丢失了。
    查看全部
  • 按住 alt+眼睛 单独这个图层的显影模式
    查看全部
  • 按cmd+图层 可以选中 或者 用快速选中 来选中
    查看全部
  • 自定义或web形式
    查看全部
  • 选择图层:ctrl+鼠标左键 选区: 1)画正方形、画圆形:shift+鼠标左键拖动 2)画固定圆心的圆:alt+shift+鼠标左键拖动 3)增加选区:shift 4)减去选区:alt 5)删除选区:ctrl+d 6)在工具的扩展中轮流切换:shift+工具的快捷键 放大:ctrl++; 缩小:ctrl+-; 可拖动:space; 快速选择工具: 缩小:[ 放大:] 裁剪对应图层,点击Alt并点击图层前面的眼睛(其他图层隐藏只保留这个图层,导出png)
    查看全部
  • 盖印可见图层: 盖印所有可见图层:Ctrl + Alt + Shift + E; 盖印所选图层:Ctrl + Alt + E;
    查看全部
  • photoshop界面设置
    查看全部

举报

0/150
提交
取消
课程须知
本课程适合对Photoshop有简单了解,希望学习前端开发切图方法的用户。
老师告诉你能学到什么?
使用Photoshop从网页设计师提供的psd中获取网页前端开发过程中所需要的资源,并进行简单的调整和处理。

微信扫码,参与3人拼团

微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!