• 切图


    切图

    一、 设置默认选项(保存工作区)

    1.编辑菜单-首选项-单位与标尺-标尺&文字的单位:像素(px)
    2.窗口菜单-打开面板(其它关掉):图层、信息、历史记录、选项、工具
    3.视图菜单-打开功能:对齐(吸附效果)、标尺、显示额外内容、显示-参考线(从标尺拖出)

    二、 工具(选项)面板

    1.移动:勾选“自动选择”,下拉列表选择“图层”
    2.魔棒:容差-越小越精确

    三、 设计稿信息

    1.尺寸信息:文字大小、行高:

    单独文字图层:选择文字工具(工具面板)-选择文字-查看选项面板(行高需点出右侧小文件夹按钮)
    合并背景图层:矩形框工具手测(不同字体有误差,尽量选择稍大的字),行高-第一行字下~第二行字下

    2.颜色信息:字体取色与字体尺寸获取相似(单独&合并),有叠加效果的不可看字体信息,应用取色器

    四、 快捷键

    1.撤销多步:ctrl+alt+z
    2.缩放:ctrl+1(100%) / alt+滚轮 / ctrl+”-“”+”
    3.添加到选区:shift / 从选区减去:alt / 与选区交叉:shift+alt(两边各选一点选区相加,可测量两点之间距离(含))
    4.新建:ctrl+n
    5.存储为WEB格式:alt+shift+ctrl+s(背景内容要选透明)

    五、 切图

    1.带文字的,隐藏文字只留背景(除非文字有特效)

    单独文字图层:隐藏文字图层
    合并背景图层:
    -可拉伸:矩形选框选一部分背景,按crtl+t自由变换,往右拉隐藏文字,后双击。
    -不可拉伸(有纹理):矩形选框选一部分背景,按alt往右逐步盖住文字。(按shift可保持水平稳定移动)

    2.单个图层:移动工具选择 / 多个图层:图层面板中ctrl选择,ctrl+e合并
    3.切片:拉参考线-切片工具(裁剪下)-选项栏“基于参考线切片”

    六、 图片类型

    1.JPG:色彩丰富,无透明效果(品质60~80即可)
    2.PNG8:色彩不太丰富,无论有无透明效果?(256色,扩散改为无仿色,无杂边,可存储预设)
    3.PNG24:半透明效果(阴影),IE6不支持PNG24半透明
    4.PSD:为保证图片质量、图层,保留一份PSD,要修图的在PSD修改后导出

    七、 修改与维护

    1.修改PNG8图片时,须设图像菜单-模式-索引颜色改为RGB颜色(否则颜色值不正确)
    2.更改画布大小:图像菜单-画布大小-定位改为左上角(CSS定位属性可不用更改)

    八、 图片合并

    CSS-sprite

  • 相关阅读:
    使企点QQ来消息时不自动弹出窗口(以避免错过旧的消息和避免正在回复A时自动定位到B从而影响客服效率)
    8款开源聊天软件
    博客园设置皮肤(宽屏等)及选择文本编辑器
    Windows Server 2019 设置使用照片查看器查看图片
    使windows10重启后打开上次的文件夹和程序
    TinyMCE 5 富文本编辑器好
    wordpress 安装 Elementor PRO 插件(破解版)
    无法打印,提示“windows 打印后台处理程序 没有运行”的解决方案
    第一次将代码提交至git error: failed to push some refs to 'https://gitee.com/xxx/test.git'
    git本地和远程的关联问题
  • 原文地址:https://www.cnblogs.com/qiuchen/p/4732596.html
Copyright © 2020-2023  润新知