opacity声明来设置元素的透明值,当opacity设置元素的透明值,内部的文字及元素也会透明,通过RGBA设置的颜色值只针对当前元素,内部的文字及元素的透明值并未发生变化

 
opacity声明来设置元素的透明值(改透明度的值介于0-1之间的小数, 0.5表示50%透明)。

opacity的特点是:当opacity设置元素的透明值,内部的文字及元素也会透明

复制代码

代码如下:

.demo{ 
 
filter:alpha(opacity=30); 
opacity:0.3; 
}

注:这段代码class为demo的标签元素的透明值为30%,里面的文字及元素透明值也会变成30%

RGBA也是用来设置颜色的。

  R:红色值 正整数 | 百分数

  G:绿色值 正整数 | 百分数

  B:蓝色值 正整数 | 百分数 

  A:透明度 (取值0-1之间)

通过RGBA设置的颜色值只针对当前元素,内部的文字及元素的透明值并未发生变化

复制代码

代码如下:

.demo{

}

注:这段代码class为demo的标签元素的透明值为30%,里面的文字及元素透明值无任何变化。

RGBA设置颜色值 浏览器支持性:

有关opacity或RGBA设置颜色值及元素的透明值的更多相关文章

  1. opacity与RGBA透明的区别

    为什么不使用opacityCSS3 还允许通过opacity 声明来设置元素的透明度.该透明度的值也是一个介于0 到1 之间的小数(如将opacity 设置为0.1 表示为10%透明).但是这种透明度 ...

  2. 深入了解opacity和rgba

    1. rgba 首先它是一个属性值,语法为rgba(r,g,b,a) - r为红色值, 正整数 | 百分数 - g为绿色值,正整数 | 百分数 - b为蓝色值,正整数 | 百分数 - a为alpha( ...

  3. css基础--深入理解opacity和rgba的区别

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 首先这两个都与透明度有关,那么他们之间有什么具体的区别呢?在实际工作中我们需要注意什么呢?请您接着往下看 语法 1. rg ...

  4. tween.js是一款可生成平滑动画效果的js动画库。tween.js允许你以平滑的方式修改元素的属性值。它可以通过设置生成各种类似CSS3的动画效果。

    简要教程 tween.js是一款可生成平滑动画效果的js动画库.相关的动画库插件还有:snabbt.js 强大的jQuery动画库插件和Tweene-超级强大的jQuery动画代理插件. tween. ...

  5. CSS设置行内元素和块级元素的水平居中、垂直居中

    CSS设置行内元素的水平居中 div{text-align:center} /*DIV内的行内元素均会水平居中*/ CSS设置行内元素的垂直居中 div{height:30px; line-heigh ...

  6. XamarinAndroid组件教程设置自定义子元素动画(二)

    XamarinAndroid组件教程设置自定义子元素动画(二) (9)打开MainActivity.cs文件,为RecylerView的子元素设置添加和删除时的透明动画效果.代码如下: …… usin ...

  7. XamarinAndroid组件教程设置自定义子元素动画(一)

    XamarinAndroid组件教程设置自定义子元素动画(一) 如果在RecyclerViewAnimators.Animators中没有所需要的动画效果,就可以自定义一个.此时,需要让自定义的动画继 ...

  8. jQuery 获取、设置表单元素的值

    获取表单元素值: 文本框,文本区域: $("#txt").attr("value"): 多选框 checkbox:$("#checkbox_id&qu ...

  9. 雪碧图(background-position)、overflow、title中的小图标、光标、rgb 和opacity 与rgba

    一.background-position     雪碧图 我们的html和css中有三个属性可以向服务器发送请求:src   url    href 1.我们为什么使用雪碧图? 因为我们使用雪碧图之 ...

随机推荐

  1. NYOJ 119 士兵杀敌(三) RMQ ST

    NYOJ 119 士兵杀敌(三) RMQ ST 题目链接:http://acm.nyist.net/JudgeOnline/problem.php?pid=119 思路: ST在线 预处理O(nlog ...

  2. ArcGIS jsAPI (4.x)本地部署字体符号乱码

    在下载了新版arcigs 的 JS API 后,每次部署在IIS中都会出现部件字体乱码的问题,需配置响应标头和添加文件映射 一. HTTP响应标头配置 在 IIS 中的 HTTP响应标头 中加入以下配 ...

  3. ElasticSearch 学习记录之ES几种常见的聚合操作

    ES几种常见的聚合操作 普通聚合 POST /product/_search { "size": 0, "aggs": { "agg_city&quo ...

  4. 简单理解OpenGL模型视图变换

    前几天学习了OpenGL的绘图原理(其实就是坐标的不停变换变换),看到网上有个比较好的例程,于是学习了下,并在自己感兴趣的部分做了注释. 首先通过glMatrixMode(GL_MODELVIEW)设 ...

  5. 10.0.0.55训练赛 Writeup

    From LB@10.0.0.55 Misc 0x01 misc100(图片隐写) 首先用binwalk扫了一下,发现没毛病. 然后就搜了一下jpg的文件尾FFD9,如下图,看到了png格式的标志IH ...

  6. Unity 3D游戏开发引擎:最火的插件推荐

    摘要:为了帮助使用Unity引擎的开发人员制作更完美的游戏.我们精心挑选了十款相关开发插件和工具.它们是:2D Toolkit.NGUI.Playmaker.EasyTouch & EasyJ ...

  7. Objective-C基础语法高速入门

    Objective-C是Mac软件开发领域最基本的开发语言,假如我们对C语言已经非常熟悉或者具有面向对象语言的基础.对于我们学习Objective-C将会非常实用. 方法调用(Calling Meth ...

  8. 对使用多个swiper下标有时显示不出来的问题

    这久写了一个网页,其中有很多的轮播图及tab页面切换,就使用了swiper框架,有时一个网页要用到6-8个,如此就出现了下图这种问题: 有时刷新看不到,有时又能看到,tab切换过去的页面也看不到,其实 ...

  9. 为什么MOBA、“吃鸡”游戏不推荐用tcp协议——实测数据

    欢迎大家前往云加社区,获取更多腾讯海量技术实践干货哦~ 作者:腾讯云游戏行业资深架构师 余国良 MOBA类和"吃鸡"游戏为什么对网络延迟要求高? 我们知道,不同类型的游戏因为玩法. ...

  10. JAVA入门[5]-初步搭建SpringMVC站点

    一.新建Module 1.新建Module,类型如下图所示: 2.为项目添加Spring框架支持,操作步骤如下: 首先在Module右键->Add Framework Support: 2.Sp ...