前端Photoshop切图要点.docx_第1页
前端Photoshop切图要点.docx_第2页
前端Photoshop切图要点.docx_第3页
前端Photoshop切图要点.docx_第4页
全文预览已结束

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

前端笔记Photoshop切图一、什么是切图?1. 从设计稿(.psd文件)里切出网页素材(.png/.jpg文件);2. 编写代码，在代码中引入切图，实现静态页面。二、为什么要切图?给网页提供图片素材：l HTML:imgl CSS:background三、如何切图?-使用PS工具(Photoshop)1、PS首选项设置：（1）编辑首选项单位与标尺： 将单位(标尺/文字)改成像素。面板：（2）在“窗口”菜单下开启：工具/选项/信息(F8)/图层/历史记录（3）调整面板后，需要保存工作区：窗口工作区新建工作区2、切图常用工具移动工具：在选项面板中设置：自动选择，图层。矩形选框工具 魔棒工具裁剪工具+切片工具缩放工具：快捷键：1. 放大：Ctrl + 加号;缩小：Ctrl+减号;100%：Ctrl + 1;3. Alt +鼠标滚轮(顺滑/逆滑)取色器：吸取颜色撤销：Ctrl+Z;连续撤销：Ctrl+Alt+Z;在历史记录面板里选择。4、辅助视图在“视图”菜单下开启：对齐/标尺(Ctrl+R)/显示参考线(Ctrl+;)需要开启视图菜单下的显示额外内容，才能看到画布里的参考线和网格。 5、测量、取色获取设计稿信息：尺寸信息：通过“测量”获取颜色信息：通过“取色”获取测量(所有数字都要测量)：测量方式：矩形选框工具&信息面板测量数据：高度、高度/内边距、外边界/边框、定位、文字大小、行高、背景图位置。6、矩形选框工具选择页面较大区域方法：在左侧画一个小矩形框，在右侧再画一个小矩形框，在信息视图里显示相关区域的大小。取色：取色方式：“拾色器&吸管工具”：吸取：边框色/背景色/文字色。取色工具巧用：使用“魔棒工具”来确定是否是线性渐变。切图切图及切图的各种操作：隐藏文字(独立图层和非独立图层的不同操作方法
人人文库> 全部分类> 生活休闲 > 科普知识

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论