CSS设置文字背景虚化,变透明的两种方法

CSS文字背景虚化,变透明

    • 拥有大背景,让div块变透明的方法:
    • 方法1.背景是透明了,内容也会随之变透明。
    • 方法2.仅背景透明

在整个项目有大背景的前提下,想让某表格背景或div块的背景不是白色,而是用大背景。需要将div或其他模块背景色透明。

拥有大背景,让div块变透明的方法:

最初的图片:
CSS设置文字背景虚化,变透明的两种方法_第1张图片

方法1.背景是透明了,内容也会随之变透明。

filter:alpha(opacity=50);  /*支持 IE 浏览器,范围值0~100,值越大透明度越高哦*/
-moz-opacity:0.50; /*支持 FireFox 浏览器,范围值0~1,*/
opacity:0.50;  /*支持 Chrome, Opera, Safari 等浏览器,范围值0~1*/

背景和文字一起透明了的图:
在这里插入图片描述

方法2.仅背景透明

background-color:rgba(0,0,0,0~1),使用这个方法就只会设置div背景透明,而不会影响到div里的内容。
1.前三个0,0,0是设置原先背景颜色,我最初的是(255,255 ,255)白色背景。可以通过查看选择自己喜欢的背景虚化。
2.最后一个表示alpha值,就是透明度值,不透明为1。0~1,可以选择0.5等根据自己想要的虚化程度决定。

CSS设置文字背景虚化,变透明的两种方法_第2张图片
效果图如下,文字内容不受影响。
CSS设置文字背景虚化,变透明的两种方法_第3张图片

你可能感兴趣的:(CSS小方法,css,html,javascript)