1、opacity:

opacity的值会被它的所有子元素继承,也就是说不可能让一个元素比他的父元素更加不透明,但你可以让他变得更透明点

Firefox  Webkit  Opera支持,注意IE

2、使用Alpha通道可以像其他任何颜色值一样被子元素继承,但元素的整体不透明度并不受影响,rgba值只能应用到它的指定元素上,所以子元素可以否决所有的继承

Firefox  Webkit  Opera支持,注意IE

3、颜色变量

 p {color:black;}
p:last-child{
backgorund-color:black;
color:white;
}
p abbr {border-bottom : 6px double currentColor;}

更新父元素颜色而不需要担心如何把该颜色也设置到相关的子元素上

Firefox  Webkit  Opera支持,注意IE

css3 -- 颜色与不透明度的更多相关文章

  1. CSS3颜色特征温故

    网页是色彩的表现原理:显示器是由一个个像素构成,利用电子束来表现色彩.像素把光的三原色:红色(R).绿色(G).蓝色(B)组合成的色彩按照科学原理表现出来.一个像素包含8位元色彩的信息量,又从0 ~ ...

  2. css3 颜色记

    css3 颜色 opacity 使元素呈现出半透明效果. opacity:alphavalue || inherit alphavalue:默认值为1,可以取0~1任意浮点数.取值为1时,元素完全不透 ...

  3. 熟悉css/css3颜色属性

    颜色属性无处不在.字体要用颜色,背景可以有颜色,粒子特效更是离不开颜色.本文参考了一些资料简单总结下以备日后查阅. css中颜色的定义方式: 十六进制色 RGB & RGBA HSL & ...

  4. CSS3 颜色属性

    关键字颜色 red 十六进制颜色 #FF0000 RGB颜色   rgb(255,0,0) 新增的颜色表示方法 RGBa: RGB代表光的三原色,Red.Green和Blue CSS3中可以增加一个值 ...

  5. CSS3 颜色模式

    HSL .test{background-color:hsl(<length>, <percentage>, <percentage>);} 1.length 表示 ...

  6. CSS3颜色渐变模式

       1.线性渐变:linear-gradient 语法:<linear-gradient> = linear-gradient([ [ <angle> | to <si ...

  7. CSS3颜色渐变模式总结

    1.线性渐变:linear-gradient 语法:= linear-gradient([ [ | to [, ]+) = [left | right] || [top | bottom] = [ | ...

  8. CSS3 颜色渐变、阴影、渐变的阴影

    css阴影: 外阴影:box-shadow:X Y Npx #color; 内阴影:box-shadow:inset X Y Npx #color; 文字阴影:text-shadow:X Y Npx ...

  9. css3颜色

    镂空字的2种做法

随机推荐

  1. HDU 5878 I Count Two Three (打表+二分查找) -2016 ICPC 青岛赛区网络赛

    题目链接 题意:给定一个数n,求大于n的第一个只包含2357四个因子的数(但是不能不包含其中任意一种),求这个数. 题解:打表+二分即可. #include <iostream> #inc ...

  2. POJ 1681 Painter's Problem (高斯消元)

    题目链接 题意:有一面墙每个格子有黄白两种颜色,刷墙每次刷一格会将上下左右中五个格子变色,求最少的刷方法使得所有的格子都变成yellow. 题解:通过打表我们可以得知4*4的一共有4个自由变元,那么我 ...

  3. 20145213《Java程序设计》第七周学习总结

    20145213<Java程序设计>第七周学习总结 教材学习内容总结 周末快乐的时间总是短暂的,还没好好感受就到了要写博客的周日.有人喟叹时间都去哪儿了,那本周我们就来认识一下Java里的 ...

  4. 数据库IO简介

    IO有四种类型:连续读,随机读,随机写和连续写,连续读写的IO size通常比较大(128KB-1MB),主要衡量吞吐量,而随机读写的IO size比较小(小于8KB),主要衡量IOPS和响应时间.数 ...

  5. 二、JavaScript语言--JS基础--JavaScript进阶篇--DOM对象 控制HTML元素

    1.认识DOM 文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构(节点树). 先来看看下面 ...

  6. rpm -qc 来查找安装包的配置文件

    rpm -qc elasticsearch /etc/elasticsearch/elasticsearch.yml /etc/elasticsearch/jvm.options /etc/elast ...

  7. C#学习笔记----栈与堆的知识

    http://my.oschina.net/lichaoqiang/blog/291906 当我们对.NET Framework的一些基本面了解之后,实际上,还是很有必要了解一些更底层的知识.比如.N ...

  8. 数据结构和算法 – 11.高级排序算法(上)

      对现实中的排序问题,算法有七把利剑可以助你马道成功. 首先排序分为四种:       交换排序: 包括冒泡排序,快速排序.       选择排序: 包括直接选择排序,堆排序.       插入排序 ...

  9. Android ANR分析(2)

    转自:http://blog.csdn.net/ruingman/article/details/53118202   定义 主线程在特定的时间内没有做完特定的事情 常见的场景 A.input事件超过 ...

  10. PHP不同域名cookie共享(单点登录实现原理)

    PHP使用P3P完成COOKIE跨域操作实际实用中,类似的需求有,比如说我们有两个域名,我们想实现在一个域名登录后,能自动完成另一个域名的登录,也就是单点登录(SSO)功能.为了测试的方便,先编辑ho ...