01-工具 面板 视图

这是页面制作的第一节课。怎么制作网页呢？

网页分为两步： 1.从设计稿中切出网页素材 比如说：按钮 logo 图片 背景等 2.编写代码，按效果图实现静态页面

有时候看到一些漂亮的效果没有办法用代码实现，或者说用代码实现了兼容也很难调，这个时候需要用到图片了，所以要学会切图，这是咱们要讲的，那切好之后怎么引入图片呢： 1.html中用<img />来实现 2.css中用background这个属性引入背景图 3.图片精灵（小图标，小图片按钮）通过背景定位来实现。

我们现在来进行第一步：.从设计稿中切出网页素材 我们从设计师手机拿出来源文件，切出的是jpg、png、gif的图片。

那如何切图呢？学会使用ps工具。

首选项设置 1.编辑>首先项>单位标尺

常用面板设置 1.信息面板 f8 2.历史记录面板 ctrl+z ctrl+alt+z 3.工具面板（页面最左栏默认打开） 4,选项面板（状态栏下面） 6.信息面板 8.图层面板

切图常用工具 1.移动工具 2.矩形选框工具 3.魔棒工具 4.裁剪工具+切片工具 5.缩放工具 ctrl+ ctrl- ctrl+1快速回到100% alt+滚轮 6.取色

辅助视图 1.视图>对齐 2.视图>标尺 3.视图>显示额外内容 4.视图>显示>参考线