半透明遮罩问题

半透明的遮罩如何实现，老师能大概叙述一下吗？

原子Q 2021-02-05

源自：前端企业门户网站案例 4-4 项目作业

13

收起

1回答

好帮手慕阿园 2021-02-05 14:57:50

同学你好。遮罩层可以看做是蒙在图片的一层div。关于遮罩层的实现方法，同学可以参考如下步骤设置：

1、首先可以对其设置背景色为半透明黑色：

background-color: #000;
opacity: 0.4;

2、再将大小设置与图片相同。

3、然后设置z-index让其显示在图片上层。

4、最后使用绝对定位使其定位在图片正上方。

祝学习愉快~

提问者原子Q #1

那请问下老师，图片是直接放HTML中用div做遮罩还是放css里面更好呢？这两个哪儿个会更好一点?

2021-02-05 15:02:30
好帮手慕阿园回复提问者原子Q #2

同学你好，图片和遮罩可以在html中定义，在css中设置样式
祝学习愉快~

2021-02-05 15:43:43

相似问题

请问老师渐变遮罩

这块是不是应该采用遮罩层做？

作业的中浮动的问题

半透明遮罩怎么设置啊

老师怎么让banner区有半透明遮罩

登录后可查看更多问答，登录/注册

java工程师2020版

参与学习人
提交作业 9393 份
解答问题 16556 个

综合就业常年第一，编程排行常年霸榜，无需脱产即可学习，北上广深月薪过万无论你是未就业的学生还是想转行的在职人员，不需要基础，只要你有梦想，想高薪

本课精华内容

问答作业

安装了MySQL 之后有时候自己会跳出来个黑窗口是为什么呢？

79 1

什么时候用List中的ArrayList呢，什么时候用HashSet，什么时候应该用HashMap

81 1

创建字符串的过程理解

62 1

如何干净的卸载数据库

134 1

请教一下没太懂

48 3

查看更多本课问答

请稍等 ...

意见反馈帮助中心 APP下载