ps切图html自适应屏幕,ps CC自动切图与前端CSS代码

ps切图html自适应屏幕,ps CC自动切图与前端CSS代码Photoshop是视觉设计师最强有力的武器之一,其实Photoshop也为前端开发同学带来很多惊喜。特别是从PhotoshopCC版本开始,它变得越来越有趣。今天笔者就其中几个新特性给大家介绍一下。如果您也有更多新的发现,请在下方留言与大家进行讨论。自动切图(含WebP、SVG格式):前端开发人员经常需要将很多图层切出成独立的图片。有了自动切图功能,无需花更多时间来切图了。只需在图层…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全家桶1年46,售后保障稳定

Photoshop 是视觉设计师最强有力的武器之一,其实 Photoshop 也为前端开发同学带来很多惊喜。特别是从 Photoshop CC 版本开始,它变得越来越有趣。今天笔者就其中几个新特性给大家介绍一下。如果您也有更多新的发现,请在下方留言与大家进行讨论。

自动切图(含WebP、SVG格式):

前端开发人员经常需要将很多图层切出成独立的图片。有了自动切图功能,无需花更多时间来切图了。只需在图层名后添加相应格式后缀(如.png),即可自动输出所需格式的图片。

请保持菜单“编辑->首选项->增效工具”中的“生成器”为启用状态; 依次点击菜单“文件->生成->图像资源”,确认该菜单项已被勾选;

df7538778a2f3cc3a397ec0cfaa87f35.png

9ea565f7f12d6b02a64663db9573122a.png

试着修改某个图层命名(如 iTunes.png),然后检查当前 psd 文件所在目录下的“文件名-assets” 的目录,打开此目录,发现 iTunes.png 已经躺在里面了。

f9a25c3fb4a8d36dbe4fb2d602913efe.png

常用技巧:

dccd306156ed080826307331034ae4fd.png

@2x Retina 图片的输出,在图层前添加 200% 即可,如 200% logo@2x.png ;

开启 WebP、SVG 格式的自动输出: 新建 generator.json 文件,内容如下:

{ “generator-assets”: { “svg-enabled”: true, “webp-enabled”: true }}

将此配置文件拷贝至: Windows: (Win+R后输入 %USERPROFILE% )目录下,如 C:Usersxxx Mac OS: $HOME 如“Macintosh HD>Users>xxx” 目录下 WebP 输出暂只支持 Mac OS。

复制 CSS

Photoshop CC 终于推出了“复制CSS” 功能。它能让开发人员快速获取形状的 CSS 代码。其实不少设计师也很想学习 CSS,有了这个功能,可以让这些爱学习的设计师熟悉 CSS 代码与图形的对应关系;

288a7664a1d3a0763ec2de88183dac45.png

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/210159.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • QTcpSocket 内存问题「建议收藏」

    QTcpSocket 内存问题「建议收藏」我自己测试也发现反复的connectToHost会有内存泄露,建议谨慎的使用!////////////////////////////////////////////////QTcpSocket类的方法connectToHost会泄露内存,即使把调用这个方法的QTcpSocket实例delete掉,内存也不会释放!反复connectToHost会导致段错误,十分危险。必须控制connectToH…

    2022年9月8日
  • solidworks第三方插件_django queryset合并

    solidworks第三方插件_django queryset合并前言mixins翻译成中文是混入,组件的意思。在DRF中,针对获取列表,检索,创建等操作,都有相应的mixin,一般我们自定义创建的类视图都会继承自GenericAPIView和Mixins一起使用

    2022年8月7日
  • 计算机发展概述教案_计算机的过去与未来 教案

    计算机发展概述教案_计算机的过去与未来 教案《计算机发展史教案》由会员分享,可在线阅读,更多相关《计算机发展史教案(3页珍藏版)》请在人人文库网上搜索。1、计算机发展与应用说课稿教材分析本课选自七年级信息技术上第三课,计算机的产生与发展。本课的内容较多,经过我的分析,我这节课的内容为:1,计算机的产生2,计算机的发展历史3,计算机的未来发展方向。本课知识为了解性知识,学生学完本课可以了解到今生今世的产生与发展历史,并且理解计算机的未来发展方…

    2022年10月18日
  • CSS 下拉菜单_下拉菜单html

    CSS 下拉菜单_下拉菜单html使用CSS创建一个鼠标移动上去后显示下拉菜单的效果。

    2022年10月23日
  • robotium 代码

    robotium 代码Robotium之用例分析    http://blog.csdn.net/wirelessqa/article/details/7847466robotium各种方法:http://wenku.baidu.com/link?url=XoPtudf4lgpyzhbLPGJ-6ie8VM2hcCb4Gl6rHozgOrgxWfK52nj-kHzhFbZDkoc_FASztmmPG

    2022年7月25日
  • floyed详解[通俗易懂]

    floyed详解[通俗易懂]显然Floyed算法是一个简短而好理解的算法,这里指的好理解是因为Floyed的代码长度不大,实在没理解都可以背下来,所以说是好理解,实际上是真的好理解吗?我们来看看最基础的FloyedFloyed是什么?自然是用来求多源最短路的啦,时间效率是O(n^3),有人会问那我不对每个点做一遍SPFA或dijkstra堆优化,时间效率是O(n^2logn)那不是快很多?实际上因为Floyed

    2022年6月16日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号