百度前端技术学院是一个为大学生创办的免费的前端技术实践、分享、交流平台。由百度校园招聘组、百度校园品牌部、百度前端技术部以及多个百度的前端团队联合创办。学院组织了一批百度在职工程师,精心编写了数十个实践编码任务,将技术知识点系统有机地串联在各个充满趣味与挑战的任务中,同学们通过实际地编码练习来掌握知识,再辅以互相评价、学习笔记等方式,加深对于学习内容的理解。在过去的三年中,百度前端技术学院累积吸引了上万名同学参加,并且有数十名同学在学习后,顺利加入了百度,成为了百度的前端工程师。

PS切图

作者许榕亭课程第九天到第十一天:来做一个漂亮的网站456次浏览22018-05-10 10:19

有效的快捷键
放大图片:”CTRL” +“+”
缩小图片:“CTRL”+ “-”
显示隐藏参考线:CTRL”+ “;”
移动工具:V
合并图层: “CTRL”+ “E”
自己设置的快捷键
转换为智能对象: ”CTRL” +“,”
编辑内容: ”CTRL” +“.”
显示隐藏图层:”CTRL” +“/”
栅格化图层样式 “SHIFT”+“CTRL”+“P”
栅格化图层 “SHIFT”+“CTRL”+“M”
重点
选择移动工具,并在选项中选中“自动选择”和“图层”

方法
1、选择图层,右键“转换为智能对象” ,右键“编辑内容”,出现提示框的话直接点击“确定”即可
2、photoshop cc 2015
1)选择“编辑”=》“首选项”=》“增效工具” ,勾选“启用生成器”,选择“确定” ,重启一下photoshop,选择“文件”=》“生成”=》“图像资源” ,找到我们要的图标的图层 ,将需要的图标放在了XX分组,将XX分组重命名为XX.png ,打开我们存放psd文件的文件夹中,可以发现现在多了一个文件夹 ,打开这个多出来的文件夹就会看到我们的图标,如果不想要要这个图标,我们可以把文件的命名重新改回来
2)打开菜单“文件”->”导出"->“将图层导出到文件”,填写几个参数,“目标”即导出到哪个目录下,“文件名前缀”为所有导出图片文件名称的前缀,“仅限可见图层”只导出可见图层,“文件类型”为导出文件的类型(例如png、jpg等)。最后点击“运行”按钮开始执行自动切图。下图是切图过程PS“图层”自动切图的一个截图。可以看出PS在自动选择每个图层然后执行导出。当自动切图执行完成后,我们可以在目标目录下看到导出的所有图片。
保存类型
内容图
内容图多以商品图等照片类图片形式存在,颜色较为丰富,文件体积较大
优先考虑 JPEG 格式,条件允许的话优先考虑 WebP 格式
尽量不使用PNG格式,PNG8 色位太低,PNG24 压缩率低,文件体积大
背景图
背景图多为图标等颜色比较简单、文件体积不大、起修饰作用的图片
PNG 与 GIF 格式,优先考虑使用 PNG 格式,PNG格式允许更多的颜色并提供更好的压缩率

  • 图像颜色比较简单的,如纯色块线条图标,优先考虑使用 PNG8 格式,避免不使用 JPEG 格式
  • 图像颜色丰富而且图片文件不太大的(40KB 以下)或有半透明效果的优先考虑 PNG24 格式
  • 图像颜色丰富而且文件比较大的(40KB - 200KB)优先考虑 JPEG 格式
  • 条件允许的,优先考虑 WebP 代替 PNG 和 JPEG 格式
    从photoshop中获取css代码的方法
    找到文字对应的图层 ,选择“图层”=》“复制CSS” ,打开编辑器,在一个新文件中CTRL+V,然后就可以看到对应的CSS内容
0条评论