前端设计的切图是什么意思?怎么切?

作为一个web前端初学者,对于html5、css3、jquery、w3c、前端、切图、hack、雪碧图等这些关键词一定会比较多见到,其中切图到底是指的什么?很多初学者都会搞错,在网页三剑客那会儿,没有前端的说法,切图是指将psd还原成html的过程,有点类似蹴鞠(切图)和足球(前端)的意思。

以下来自知乎的QA式解答,很通俗。

1、切图是什么意思?

切图就是将 .psd 设计稿还原成 Web 页面的过程,这个过程包括两部分:

切出素材

编写代码实现

前端设计的切图是什么意思?怎么切?-1
2、为什么要切图?

没有人可以直接把一整张图片引用页面,当作 Web 页面的。切图的主要目的就是给网页提供图片素材 ,可以让你从 html 或者 css 里引入图片。

html: 《img src alt=””/》

3、切图怎么切?

使用 PS 工具

使用背景图

图片合并方案

浏览器兼容

4、都需要切哪些图?

修饰性,用在 css 里,icon、logo、有特殊效果的按钮和文字;

内容性,用在 html 里,Banner、广告图片、文章配图。

5、切出来的图片保存为哪种格式?

修饰性的保存为 png24(支持半透明),png8。内容性的保存为 jpg。

6、有哪些可以学习的切图教程

建议可以参考一下慕客网和网易云课堂的前端切图部分。

(0)
上一篇 2022年3月22日 09:01:04
下一篇 2022年3月24日 08:58:25

相关推荐

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