css3 RGBA 红色R+绿色G+蓝色B+Alpha通道
语法:
R:红色值。正整数 | 百分数
G:绿色值。正整数 | 百分数
B:蓝色值。正整数| 百分数
A:透明度。取值0~1之间
取值:
<length>:Hue(色调)。0(或360)表示红色,120表示绿色,当然可以取其他数值来确定其他颜色。
<percentage>:Saturation(饱和度),取值为0%到100%之间的值。
<percentage>:Lightness(亮度)。取值为0%到100% 之间值;
<opacity>:alpha(透明度)。取值在0到1之间。
例如:
background: rgba(255,255,0,1);
兼容性问题处理:
/* IE5 - 7 */
filter: alpha(opacity=80);
/* IE 8 */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
/* Everyone else */
opacity: 0.8;
写法: background: rgba(255,255,0,0.8);
第一种:前景色color
color: rgba(255, 0, 0,0.5);
第二种:边框色border-color
border:5px solid rgba(255,0,0,0.5);
第三种:字体的阴影色text-shadow
text-shadow : 0 2px 1px rgba(255,0,0,0.3);
第四种:改变边框阴影色
box-shadow: 0 2px 2px rgba(255,0,0,0.6);
css3 RGBA 红色R+绿色G+蓝色B+Alpha通道的更多相关文章
- Word里的红色、绿色和蓝色波浪线
有时候我们写完文章会发现,有的地方有红色波浪线,有的地方有绿色/蓝色二重线,那么这两种线各代表什么意思呢?其实红色波浪线代表此处存在拼写错误,绿色/蓝色波浪线代表此处可能有语法错误.如果你不希望Wor ...
- 制作透明色:《CSS3 RGBA》与Opacity样式用法
前面我们一起探讨了一下CSS3 Gradient(css3 渐变),今天我们一起来探讨一下CSS3中的RGBA.RGB对于大家来说一点不陌生,他就是红色R+绿色G+蓝色B,那现在我们所说的RGBA又是 ...
- 编程:在屏幕中间分别显示绿色、绿底红色、白底蓝色的字符串 'welcome to masm!'
body, table{font-family: 微软雅黑; font-size: 13.5pt} table{border-collapse: collapse; border: solid gra ...
- RGBa颜色 css3的Alpha通道支持
CSS3中,RGBa 为颜色声明添加Alpha通道. RGB值被指定使用3个8位无符号整数(0 – 255)并分别代表红色.蓝色.和绿色.增加的一个alpha通道并不是一个颜色通道——它只是用来指定除 ...
- lab 颜色模式的生理原因 黄色, 洋红色 刺眼。 绿色,蓝色,不刺眼。
hsb 颜色模式理解了. lab 颜色模式,都说是生理原因.没说是啥生理原因. 猜测:黄色, 洋红色 刺眼. 绿色,蓝色,不刺眼. https://blog.csdn.net/self_mind/ ...
- CSS-3 RGBA的使用
由于IE-8及以下都不支持 RGBA(),所以往往大家都不用这个属性,而是用图层叠加的方式去实现我们想要的效果.因为 opacity 这个属性是会影响到子孙元素的. 例如: <div class ...
- CSS3 RGBA等于RGB加上opacity吗?
在我们前端设计里有两篇教程: CSS3 RGBA colors使用说明 css3中opacity属性学习与实践,他们公别介绍了RGBA,RGB,opacity的用法,这里我们把这三个属性放在一起来考虑 ...
- 图像处理术语解释:灰度、色相、饱和度、亮度、明度、阿尔法通道、HSL、HSV、RGBA、ARGB和PRGBA以及Premultiplied Alpha(Alpha预乘)等基础概念详解
☞ ░ 前往老猿Python博文目录 ░ 一.引言 由于老猿以前没接触过图像处理,在阅读moviepy代码时,对类的有些处理方法代码看不懂是什么含义,为此花了4天时间查阅了大量资料,并加以自己的理解和 ...
- 编程:在屏幕中间分别显示绿色、绿底红色、白底蓝色的字符串'welcome to masm!'
80*25彩色字符模式显示缓冲区的结构: 内存地址空间中,B8000H~BFFFFH共32KB的空间,为80*25彩色字符模式的显示缓冲区.向这个地址空间写入数据,写入的内容将立即出现在显示器上. 在 ...
随机推荐
- js之变量介绍
变量提升 JavaScript的函数定义有个特点,它会先扫描整个函数体的语句,把所有申明的变量“提升”到函数顶部: 'use strict'; function foo() { var x = 'He ...
- java几种常见的排序算法总结
/*************几种常见的排序算法总结***************************/ package paixu; public class PaiXu { final int ...
- 重构指南 - 移除重复内容(Remove Duplication)
在项目中或多或少的都存在着重复的或者功能相似的代码,如果要对代码做改动,就要修改多个地方,所以我们需要将多处重复的代码提取到一个公共的地方供统一调用,以减少代码量,提高代码可维护性. 重构前代码 pu ...
- mysql 语句学习一 关于系统信息的查询
首先说一下,SQL语句是不区分大小写的. 1.SELECT VERSION(); -- 查询当前版本号 2.SELECT CURRENT_TIME(); -- 查询当前时间 3.S ...
- 编写可维护的 Gruntfile.js
load-grunt-tasks 插件 首先介绍下 load-grunt-tasks 这个插件. 我们一般都会把所有用到的插件以及插件的配置写到 Gruntfile.js 里面,对于小项目来说这个文件 ...
- Android 从 Web 唤起 APP
前言 知乎在手机浏览器打开,会有个 App 内打开的按钮,点击直接打开且跳转到该详情页,是不是有点神奇,是如何做到的呢? 效果预览 Uri Scheme 配置 intent-filter Androi ...
- 【Gradle】 Gradle 综合
Gradle User Guide:http://www.gradle.org/docs/current/userguide/userguide.html 针对它的中文翻译:http://ask.an ...
- Ubuntu 下安装Mongodb
Mongodb是一款开源的数据库,这里不用我多说了,下面说一下Ubuntu下安装Mongodb可能遇到的问题和解决方案. 故事背景: 今天M$促销,1¥Windows Azure 4000¥-30天的 ...
- 开始学习git
今天看着廖雪峰的git使用教程开始学习git.不过没有将项目托管在github上,而是选择托管在了码云上. 看着明白做起来还是出了些问题,不过好在最后都解决了.果然眼高手低要不得. 试着将自己平时学习 ...
- bootstrapTable表格表头换行
使用bootstrapTable组件,达到表头中有一格显示两行,其他表头均为一行,效果图如下: 代码: { field : 'pay_date', title : '已还款完成时间', valign: ...