<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>无标题文档</title>

 <style type="text/css">

 li[class^="rgba"]{

     float:left;

     width:100px;

     height:80px;

     border:#CCC solid 1px;

     text-align:center;

     font-size:12px;

 }

 li[class*="1"]{background:rgba(255,0,0,0.1);}

 li[class*="2"]{background:rgba(255,0,0,0.3);}

 li[class*="3"]{background:rgba(255,0,0,0.5);}

 li[class*="4"]{background:rgba(255,0,0,0.7);}

 li[class*="5"]{background:rgba(255,0,0,0.9);}

 </style>

 </head>

 <body>

 <li class="rgba1">你好</li>

 <li class="rgba2">你好</li>

 <li class="rgba3">你好</li>

 <li class="rgba4">你好</li>

 <li class="rgba5">你好</li>

 </body>

 </html>

css rgba透明度变化的更多相关文章

  1. js渐隐渐现透明度变化淡入淡出轮播图

    js渐隐渐现透明度变化淡入淡出轮播图.焦点图 一些广告banner展示常见. (附件) <!DOCTYPE html> <html> <head> <meta ...

  2. IE兼容rgba()透明度

    一般浏览器的背景透明度可以直接设置 background:rgba(0,0,0,.5); -webkit-background:rgba(0,0,0,.5); -o-background:rgba(0 ...

  3. css有关鼠标移动上去图片变透明度变化

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. css设置透明度

    使用新的CSS3的"RGBA"声明,不仅仅让我们像通常一样设置RGB颜色,而且还可以设置其透明度. RGBA像RGB一样设置颜色,而这个"A"--RGBA中的最 ...

  5. css——rgba（）和opacity的区别

    (学习笔记) 首先他们都能实现透明效果,不同的是作用对象. rgba()是css中设置背景颜色中的一个属性.而opacity是css的一个属性,也就是rgba()的作用对象是元素的背景颜色或元素的颜色 ...

  6. css rgba/hsla知识点讲解及半透明边框

    一.RGBA(R,G,B,A) 参数: R:红色值.正整数 | |百分数 G:绿色值.正整数 | |百分数 B:蓝色值.正整数 | |百分数 A:Alpha透明度.取值0~1之间. 说明:此色彩模式与 ...

  7. js动画--透明度变化

    对于设置元素的透明度的变化.主要思想也是通过一个定时器来控制的. 此外对于透明度有一点要说明一下,就是在IE中我们在css中设置透明度的方式filter:alpha(opacity:value)其中v ...

  8. jquery 底部导航透明度变化

    如果滚动条到达底部,footer-nav 的透明度为1,否则为0.8: html <div class="footer-nav" id="footer"& ...

  9. 【学习】ie8支持rgba()透明度颜色

    (我的博客网站中的原文:http://www.xiaoxianworld.com/archives/285,欢迎遇到的小伙伴常来瞅瞅,给点评论和建议,有错误和不足,也请指出.) rgba()函数可以用 ...

随机推荐

  1. spring-boot 学习笔记一

    参考博客:https://www.cnblogs.com/ityouknow/p/5662753.html 1.构建项目: 访问http://start.spring.io/,下载demo: 下载解压 ...

  2. 解析xml文件的几种技术与Dom4j与sax之间的对比

    一.解析xml文件的几种技术:dom4j.sax.jaxb.jdom.dom 1.dom4j dom4j是一个Java的XML API,类似于jdom,用来读写XML文件的.dom4j是一个非常优秀的 ...

  3. ICSharpCode.SharpZipLib.dll 压缩多文件

    网站:http://icsharpcode.github.io/SharpZipLib/ 引用:ICSharpCode.SharpZipLib.dll private string CompassZi ...

  4. ubuntu16.04下安装Sophus

    git clone https://github.com/strasdat/Sophus.git 下载完成后 cd Sophus git checkout a621ffmkdir buildcd bu ...

  5. ubuntu安装Anaconda2-4.4.0+TensorFlow

    1.下载Anaconda 到官网http://continuum.io/downloads下载anaconda. 2.安装anaconda 在终端输入:cd ~/Downloads;        b ...

  6. strut2的标签

         DIY部落 新闻中心 交流论坛 千寻搜索   点击浏览该栏目下的更多电子书  收藏本站   struts2标签详解 文章整理: www.diybl.com 文章来源: 网络 去论坛 建我的b ...

  7. H5,PC网页屏幕尺寸相关整理(scrollLeft,scrollWidth,clientWidth,offsetWidth)

    HTML:scrollLeft,scrollWidth,clientWidth,offsetWidth到底指的哪到哪的距离之完全详解scrollHeight: 获取对象的滚动高度. scrollLef ...

  8. 64位windows 7下配置TortoiseGit（转）

    原文:http://our2848884.blog.163.com/blog/static/146854834201152325233854/ 最近感觉自己电脑上的代码太乱了,东一块.西一块……于是决 ...

  9. React-生命周期的相关介绍

    1.mounting/组件插入相关 (1)componentWillMount  模板插入前 (2)render 模板插入 (3)componentDidMount 模板插入后 2.Updating/ ...

  10. 【HTML5】HTML5的自学路线

    HTML5的开发市场已越来越火爆,他已经与我们的生活息息相关,它也成为了我们生活中的一部分,比如我们在网上购物,玩手游等等,都存在html5的影子,也正是因为html5的高度影响力,吸引了许多人开始关 ...