-
PhotoShop 选中区域 变透明 透明化 导出图片
Intro
HTML中多张图片重叠时设置图片的不透明度，
当多张图片重叠时，对上层图片只显示其部分内容(上层图片有一般是透明的，那么这部分就可以显示下层图片的样子，或网页背景色)。相关软件
-
2345看图王 10.9 (这个看图软件可以让我们看到图片的透明部分和白色部分的区别)
-
PhotoShop 23.2.1 Release
-
任意网页浏览器，如 chrome
-
任意代码编辑器，如 VSCode
图片的透明部分
以下为蓝色+白色的图片。
以下为转换过后一张蓝色+透明色(就是啥都没有)的图片：
区别是什么呢？
在HTML中引用这两张图片，并设置好网页背景色，可以看到：
如果图片中含有透明部分，则他会显示为图片下一层存在的颜色(如果没有则显示白色)。
或者我不设置网页的背景色，而是用多张img重叠。
HTML代码如下：DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>wuyujin1997title> <style> * {outline:auto;} img { width: 200px; height: 200px; } body { background-color: pink; } style> head> <body> <h1>test 测试h1> <img src="./road.jpg" alt="无透明部分"> <img src="./road.png" alt="有透明部分"> body> html>- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
road.jpg:
PhotoShop 选中图片部分区域 将其变透明 导出图片
打开图片
首先要用PS打开需要编辑的图片：
File – Open
选中要编辑的图片：
对图层“去锁”
暂时不知道在PS专业的语言里如何描述这个动作。
其次是要将图层中的锁给去了，鼠标左键单击即可：
使用索套工具选中指定区域
然后使用索套工具选中图片中的某部分区域：
选第四种索套工具(Magic Wand tool)即可（如果你的PS版本比较新，鼠标悬停至按钮处还可以看到提示。没有提示也不影响的）：
刚才选的这种索套工具比较智能，只需要在想要选中的区域里鼠标左键点击一下，他就会选中相同、相邻的颜色块：
按Delete删除选中区域(该区域变为透明)
选中了一块区域，这时按一下键盘上的 Delete 键。注意观察：按Delete的前后，右下角处的图层略缩图以及主窗口处的图片有什么变化？
选中区域+Delete之后，该区域变成了 灰白小方块覆盖的区域。而在PS中这正是表示：此处透明。继续选择右边部分，Delete 。
当然，如果你想勾选多处区域，然后只Delete一次。
可以按住Shift键，即可多次点击选中。导出图片
在右下角的 Layers/图层下面，选中刚才我们修改的那个，
右键呼出菜单，选择Export as
然后下一个界面直接Export：
然后你可以决定文件名叫什么？
然后去文件管理器：
这样你看不出来区别。
可以用 2345看图王打开，或者用上面提到过的HTML去测试一下：
另外一种导出方式
仅导出部分步骤有变化：
File-->Export-->Save for web (Legacy)... Alt+Shift+Ctrl+-->选 PNG-8-->勾选 Transparency-->Save
reference
-
-
相关阅读:
23年下半年软考系统集成（中项）报名已开始！
数学术语之源——平凡(trivial)与非平凡(nontrivial)
SMOKE 单目相机 3D目标检测【训练模型】
阿里大牛解析淘宝与Twitter 分布式系统案例与其架构设计原来源码
[js] 实现侧边菜单可用鼠标拖动调整大小的功能
数据结构--第八章--图
当需要在不同操作系统和编程语言环境中共享和处理 XML 数据时，可能会遇到哪些兼容性问题，以及如何解决？
Ubuntu终端Terminator的安装
私域电商：自主、灵活、高效的选择
Dcoker学习笔记（一）
- 原文地址：https://blog.csdn.net/wuyujin1997/article/details/127974658
