CSS实现半透明的方法
IE8不支持以前{filter:alpha(opacity=50);}的私有属性,
转而支持更规范的私有属性-ms-filter: “progid:DXImageTransform.Microsoft.Alpha(Opacity=50)”;
加之Firefox2.0和Opera9.0以前版本很少见到,
所以所有的主流浏览器都已经支持纯CSS而不用png图片来实现半透明效果,
<div id="out">
<div id="in">不透明<div>
<div id="alpha">半透明<div>
<div>
<style type="text/css">
#out{
padding:20px 0;
height:100px;
width:200px;
position:relative;
}
#in{
background:#fff;
margin:0 10px;
}
#alpha{
position: absolute;
top:;
left:;
width: 100%;
height:100%;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; /*IE8*/
filter:alpha(opacity=30); /*IE5、IE5.5、IE6、IE7*/
opacity: .3; /*Opera9.0+、Firefox1.5+、Safari、Chrome*/
z-index: -1; /*让其位于in的下面*/
background:#fff;
}
</style>
CSS实现半透明的方法的更多相关文章
- CSharpGL(40)一种极其简单的半透明渲染方法
CSharpGL(40)一种极其简单的半透明渲染方法 开始 这里介绍一个实现半透明渲染效果的方法.此方法极其简单,不拖累渲染速度,但是不能适用所有的情况. 如下图所示,可以让包围盒显示为半透明效果. ...
- 为IE单独写CSS的三种方法
本文由 Kayo Lee 发表,本文链接:http://kayosite.com/the-methods-make-css-only-for-ie.html 因为万恶的 IE 存在各种的不标准,因此, ...
- 三种纯CSS实现三角形的方法
看到像上图这样的 tip 的小三角,你会怎么办? 切个图上去?恩,不错,简单,兼容性也一级棒,不但好控制,那点小东西也增加不了多少图片的大小.但有没有更好更讲究技巧的办法呢?哈哈,那必须有啊,而且还不 ...
- CSS清除浮动的方法
CSS清除浮动的方法有哪些呢?经常性地会使用到float,很多邪门的事儿都有可能是浮动在作怪,清除浮动是必须要做的,而且随时性地对父级元素清除浮动的做法也被认为是书写CSS的良好习惯之一.下面看今天的 ...
- CSS中垂直居中的方法
昨天总结了css中水平居中的方法,今天来总结一下css中实现垂直居中的方法. line-height line-height用于实现单行文本的垂直居中,如下图中,我们要求单行文本垂直居中,只需要将di ...
- HTML5结合CSS的三种方法+结合JS的三种方法
HTML5+CSS: HTML中应用CSS的三种方法 一.内联 内联样式通过style属性直接套进HTML中去. 示例代码 <pstylepstyle="color:red" ...
- CSS模糊效果及其兼容方法
今天在整理IE滤镜时网站访问这里,居然找到模糊滤镜blur(),感觉太不可思议了,想不到IE居然会有这么多种滤镜效果,这基本上是模仿PS的.今天的重点是模糊滤镜 CSS模糊效果及其兼容方法 实例 兼容 ...
- div+css隐藏内容样式方法
div css隐藏内容样式方法 div+css隐藏内容方法 一般情况下,css隐藏的用途,如下: 1.对文本的隐藏 2.隐藏超链接(另类黑链) 3.对统计代码隐藏 4.隐藏超出图片 5.css ...
- CSS技巧: CSS隐藏文字的方法(CSS text-indent: -9999px;)
建站过过程中朋友喜欢把网站名称用H1表示,但从美观考虑,要用logo图片来代替h1,这时需要隐藏h1内的这段文字,但又不能对搜索引擎不友好,否则就失去了定义h1标签的意义. 在CSS中如何以图代字,找 ...
随机推荐
- HDU 1698 Just a Hook 区间更新 lazy标记
lazy标记 #include <iostream> #include <cstdio> #include <cstring> #include <sstre ...
- 609C Load Balancing
题意: ”平均数“的意思是:最大数和最小数之间的差值为0或1: 先求“平均”数组,再相减. #include<iostream> #include<cstdlib> #incl ...
- 无法在Web服务器上启动调试,与Web服务器通信时出现身份验证错误
问题描述: 我使用的是修改hosts,模拟真实网址来进行调试的.具体是这样的:我修改hosts文件,把某个域名,如www.163.com映射为127.0.0.1,然后在IIS信息管理器中,创建一个网站 ...
- nginx变量
nginx的全局变量参数解释: $arg_PARAMETER#这个变量包含GET请求中,如果有变量PARAMETER时的值. $args #这个变量等于请求行中(GET请求)的参数,例如foo=1 ...
- hdu 5533 Dancing Stars on Me
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5533 Dancing Stars on Me Time Limit: 2000/1000 MS (Ja ...
- hdoj 2544 最短路【dijkstra or spfa】
最短路 Time Limit: 5000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submis ...
- Modbus Poll master-slave测试 Dtech USB转485(worldsing 笔记)
1,简介 网站地址:http://www.modbustools.com/ 该网站提供了几个软件工具,可以运行于windows 2000/XP/Vista/7环境下,用来测试和仿真Modebus设备. ...
- 偶遇mysql外键不好使
原来是创建表时选择的类型不一样,应该是innoDB,而且关联的主表类型也必须是innoDB
- http 需要掌握的知识点(一)
超文本传输协议(HTTP,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议.HTTP 也属于 TCP/IP 协议族的子集,想要学习 HTTP ,先需要了解 ...
- ASP.Net Core-TagHelpers
当我们新建了一个.Net Core类型的Project时,我们会看到页面上有类似于这样的代码: 当我们运行项目,查看源代码会发现,浏览器中的就是Html代: 那么,为什么我们在页面写的代码会转化为ht ...