CSS透明度

CSS中设置透明度有两种方式:
GRBA和opacity.
下面我们就这两种方式进行简要介绍:

GRBA

语法如下:
```
rgba(R,G,B,A);
```

rgba只是单纯的设置颜色的透明度,但是标签上的文字不会透明. 即透明元素的子元素不会继承其透明效果.

代码示例如下:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><style type="text/css">.c1{background: rgba(255,255.0,1);}.c2{background: rgba(255,255,0,0.3);}</style></head><body><div class="c1">这是一个div这是一个div</div><div class="c2">这是一个div这是一个div</div></body>
</html>

运行结果:
我们可以看到,使用grba方法只是颜色发生了变化,两个div的文字都没有改变

opacity

语法如下:
```
opacity: value;
```
其中,value的取值为[0~1].

opacity属性具有继承性,因此会使得容器中所有的元素都具有透明度.所以我们设置的字体也会变为透明

代码示例如下:

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><style type="text/css">.i1,.c1{/* opacity 设置透明效果 */opacity: 1;}.i2,.c2{/* opacity 设置透明效果 */opacity: 0.35;}/* .c1{background: rgba(255,255.0,1);}.c2{background: rgba(255,255,0,0.3);} */</style></head><body><img src="img/背景2.jpg" class="i1"><img src="img/背景2.jpg" class="i2"><div class="c1">这是一个div这是一个div</div><div class="c2">这是一个div这是一个div</div></body>
</html>

运行结果如下:
我们可以看到使用opacity方法,也可以使文字变得透明

CSS透明度[简述]相关推荐

浏览器下的CSS透明度
浏览器下的CSS透明度元素透明度时常是个恼人的问题,下面这种方式可以实现所有浏览器下的透明度设置: .transparent {zoom: 1;filter: alpha(opacity=50);o ...
css 透明度_如何在网页控制透明度
文字描边透明度在网页是一个很重要的属性,非常多的特效都需要控制透明度来完成. 01 语法通过修改元素透明度 opacity:数值; opacity属性取值范围为0.0~1.0,0.0表示完全透明, ...
css的img移上去边框效果及CSS透明度
css的img移上去边框效果: .v_comment img{ height:36px; height:36px; float:left; padding:1px; margin:2px; borde ...
html中透明度100是,CSS 透明度设置方法及常见问题解析
你对 CSS 中的半透明颜色可能已经有了基础的了解,CSS透明算得上是一种相当流行的技术,但在跨浏览器支持上,对于开发者来说,可以说是一件令人头疼的事情.目前还没有一个通用方法,以确保透明度设置可以在 ...
CSS 透明度设置方法及常见问题解析
怎样在CSS样式中设置背景的透明度怎样在CSS样式中设置背景的透明度,下面给出一个具体的实例.把类为box的层设为透明. <div class="box"></ ...
html页面透明度属性,css透明度是什么属性？
css透明度属性指的是opacity属性:opacity属性可以设置一个元素了透明度级别.下面本篇文章就来给大家介绍一下CSS opacity属性,有一定的参考价值,有需要的朋友可以参考一下,希望对大 ...
html页面透明度属性,css透明度属性是什么？
css透明度属性是什么?CSS透明度属性是opacity属性.下面本篇文章就来给大家介绍一下CSS 透明度属性--opacity属性.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. ...
CSS透明度–详细概述
CSS Transparency – full overview Today we will talk about CSS. And our article will about – how to m ...
html css表格透明度,【总结】CSS透明度大汇总_html/css_WEB-ITnose
近年来,CSS不透明算得上是一种相当流行的技术,但在跨浏览器支持上,对于开发者来说,可以说是一件令人头疼的事情.目前还没有一个通用方法,以确保透明度设置可以在目前使用的所有浏览器上有效. 这篇汇总主要 ...

CSS透明度[简述]

CSS透明度

GRBA

opacity

CSS透明度[简述]相关推荐

最新文章

热门文章