css-设置背景透明度
实现透明的css方法通常有以下3种方式,以下是不透明度都为80%的写法:
css3的opacity:x,x 的取值从 0 到 1,如opacity: 0.8
兼容性:IE6、7、8不支持,IE9及以上版本和标准浏览器都支持
使用说明:设置opacity元素的所有后代元素会随着一起具有透明性,一般用于调整图片或者模块的整体不透明度,使用opacity后整个模块都透明了
css3的rgba(red, green, blue, alpha),alpha的取值从 0 到 1,如rgba(255,255,255,0.8)
所谓RGBA颜色,顾名思意就是R+G+B+A的颜色,再具体点就是red+green+blue+alpha的颜色,翻译一下就是红+绿+蓝+Alpha透明的颜色
其中,表示半透明度的0.8前面的0是可以省掉的,直接.8也是可以的。
兼容性:IE6、7、8不支持,IE9及以上版本和标准浏览器都支持
解决IE8浏览器不支持rgba的方法:
background:rgba(0,0,0,0.5); filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#7F000000,endcolorstr=#7F000000);
使用说明:设置颜色的不透明度,一般用于调整background-color、color、box-shadow等的不透明度。
在background-color中使用rgba,标准浏览器中,背景透明,文字不透明,那么使用rgba实现背景透明,文字不透明是可取的。
IE专属滤镜 filter:Alpha(opacity=x),x 的取值从 0 到 100,如filter:Alpha(opacity=80)
css-设置背景透明度的更多相关文章
- CSS 设置背景透明度,不影响子元素
由于 opacity 属性能被子元素继承,使用它设置父元素背景透明度时也会影响子元素. 解决方法: 1> 使用 RGBA Example .classname { /* RGBa, 透明度0.6 ...
- img只显示图片一部分 或 css设置背景图片只显示图片指定区域
17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...
- css 设置背景图片模糊,内容不模糊
需求:一个div设置了background: url,现在需要使图片背景模糊,div内的文字清晰显示. 原始代码: <!DOCTYPE html> <html lang=" ...
- css设置背景固定不滚动效果的示例
css设置背景固定不滚动效果的示例 背景固定不滚动各位看到最多的无非就是QQ空间了,我们在很多的空间都可以看到内容滚动而北京图片不滚动了,下文整理了几个关于背景固定不滚动css代码. 一.css设置背 ...
- 解决css设置背景透明,文字不透明
设置元素的透明度: -moz-opacity:0.8; /*在Firefox中设置元素透明度 filter: alpha(opacity=80); /*ie使用滤镜设置透明 但是当我们对一个标 ...
- CSS——设置背景
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- css改变背景透明度【转】
兼容主流浏览器的CSS透明代码: .transparent_class { filter:alpha(opacity=50); -moz-opacity:0.5; -khtml-opacity: 0. ...
- css设置背景图片,ie显示不了
本来是想给导航栏<div class="nav"></div>添加背景图片的,设置css样式如下: .nav{background:url("ht ...
- (转)background-position—CSS设置背景图片的位置
background-position :在 CSS 中通过 background-position 属性可以调整背景图片的位置.因为在默认情况下背景图片都是从设置了 background-posit ...
- CSS设置背景透明字体不透明
写CSS时给容器设置透明度的时候如果使用background-color: #000000; opacity: 0.5;这时会出现容器里的文字也跟着透明.解决办法是不用十六进制的色值和透明度分开写,使 ...
随机推荐
- Spring事务管理(编码式、配置文件方式、注解方式)
1.事务(https://www.cnblogs.com/zhai1997/p/11710082.html) (1)事务的特性:acdi (2)事务的并发问题:丢失修改,脏读,不可重复读 (3)事务的 ...
- @Autowired,@Resource,@Qualifier,@Primary,@Inject的作用和区别
@Autowired注解的用法:可以用于构造器,方法,参数,字段进行属性注入,有一个required属性,默认是true,当改成false时,如果注入的属性在容器中不存在也不会报错@Resource该 ...
- django 3.1 序列化讲述
序列化Django对象¶ Django的序列化框架提供了一种将Django模型"翻译"为其他格式的机制.通常,这些其他格式将基于文本,并用于通过电线发送Django数据,但是序列化 ...
- 069 01 Android 零基础入门 01 Java基础语法 09 综合案例-数组移位 01 综合案例-数组移位-案例需求
069 01 Android 零基础入门 01 Java基础语法 09 综合案例-数组移位 01 综合案例-数组移位-案例需求 本文知识点:综合案例-数组移位-案例需求 说明:因为时间紧张,本人写博客 ...
- LiteOS-任务篇-源码分析-删除任务函数
目录 前言 笔录草稿 源码分析 LOS_TaskDelete函数源码分析 完整源码 参考 链接 前言 20201009 LiteOS 2018 需要会通用链表 笔录草稿 源码分析 LOS_TaskDe ...
- 多测师讲解python_斐波那契数列:_高级讲师肖sir
def f(n): a,b=1,1 if n==1 or n ==2: return 1 else: i=3 while i<=n: a,b=b,a+b i+=1 return bprint(f ...
- 1T数据快速排序!十种经典排序算法总结
1 冒泡排序 每次循环都比较前后两个元素的大小,如果前者大于后者,则将两者进行交换.这样做会将每次循环中最大的元素替换到末尾,逐渐形成有序集合.将每次循环中的最大元素逐渐由队首转移到队尾的过程形似&q ...
- DFS深度优先搜索算法
Lake Counting(POJ No.2386) 有一个大小为N*M的园子,雨后积起了水.八连通的积水被认为是在一起的.请求出园子里共有多少个水洼?(八连通是指下图中相对w的*部分) * * * ...
- pytest文档40-pytest.ini配置用例查找规则(面试题)
前言 面试题:pytest如何执行不是test开头的用例?如执行 xxx_*.py这种文件的用例. pytest.ini 配置文件可以修改用例的匹配规则. pytest命令行参数 cmd打开输入pyt ...
- 搭建分布式 Redis Cluster 集群与 Redis 入门
目录 Redis 集群搭建 Redis 是啥 集群(Cluster) Redis Cluster 说明 Redis Cluster 节点 Redis Cluster 集群模式 不能保证一致性 创建和使 ...