手抄报 安全手抄报 手抄报内容 手抄报图片 英语手抄报 清明节手抄报 节约用水手抄报

前端开发中背景透明,文字不透明怎么解决

时间:2024-10-12 00:30:58

1、首先我们将HTML的代码写出了,给出了一个简单的demo,只是实现效果,所以在样式上面可能会有些丑,还望见谅。

前端开发中背景透明,文字不透明怎么解决

2、为了使得效果明显一些我们给body增加一个颜色,请原谅我的审美,我这里给body填充了一个大红色。

前端开发中背景透明,文字不透明怎么解决
前端开发中背景透明,文字不透明怎么解决

3、背景有了之后我们去设置样式,在这里我使用了background的rgba这个属性,将背景色给了一半透明,并给确定和取消增加了样式。

前端开发中背景透明,文字不透明怎么解决

4、做完上述工作后我们来运行一下我们的代码,运行结果如下图所示,很明显我们想要的效果实现了。

前端开发中背景透明,文字不透明怎么解决
© 手抄报圈