css中如何设置透明度
怎样在CSS样式中设置背景的透明度,下面一个具体的实例。把类为box的层设为透明。
<div class="box"></div>
<style>
.box{width:300px; height:200px; margin:0 auto; boxder:1px solid #ccc; background:#000; filter:alpha(opacity:30); opacity:0.3; -moz-opacity:0.3;-khtml-opacity: 0.3}
</style>
其中background:#000; filter:alpha(opacity:30); opacity:0.3;为关键代码,当opacity值为1时,表示完全不透明,为0时表示完全透明。
其关的属性介绍如下:
opacity: 0.3;这是“最重要的”,因为它是在CSS的现行标准。这将在Firefox,Safari和Opera的大多数版本的工作。这将是你所需要的一切如果所有的浏览器都支持目前的标准。当然是他们不会错。
filter:alpha(opacity=30);这一个是针对IE浏览器
-moz-opacity:0.3;你需要这一个支持老版本的Mozilla浏览器如Netscape Navigator。
-khtml-opacity: 0.3;这是旧版本的Safari(1.×)当渲染引擎是使用仍被称为kthml,而不是目前的WebKit。
css中如何设置透明度的更多相关文章
- css中怎么设置透明度的问题
小伙伴们是不是在找怎么样去设置页面的透明度的方法呢...别找了,我这儿就有,而且肯定够用了. 我自己会用到的就有两种,可以和大家分享一下. 1.用opcity的方法去设置透明度.代码如下: .div ...
- css中filter:alpha透明度使用
css中filter:alpha透明度使用 使用filter可以设置透明度,filter:alpha在IE下是没有问题的,要支持firefox就需要使用-moz-opacity,下面有个不错的示 ...
- CSS中如何设置父元素透明度不影响子元素透明度
原因分析: 使用css的opcity属性改变某个元素的透明度,但是其元素下的子元素的透明度也会被改变,即便重定义也没有用,不过有个方法可以实现,大家可以看看. 可以使用一张透明的图片做背景可以达成效果 ...
- CSS中怎么设置元素水平垂直居中?
记录怎么使用text-align与vertical-align属性设置元素在容器中垂直居中对齐.text-align与vertical-align虽然都是设置元素内部对齐方式的,但两者的用法还是有略微 ...
- CSS中水平居中设置的几种方式
1.行内元素: 如果被设置元素为文本.图片等行内元素时,水平居中是通过给父元素设置 text-align:center 来实现的. <body> <div class="t ...
- css中absolute设置问题和如何让div居中
今天设置多个div到页面正中间的时候,在第一层<div class="map">中设置如下: .map{ position:absolute: top:50%; lef ...
- css中hover设置边框后div中内容后移解决方法
<style> .demo{width:1200px;height:400px;background:#fff;} .demo:hover{border:1px solid #cecece ...
- css中display设置为table、table-row、table-cell后的作用及其注意点
html: <div class="table"> <div class="row"> <div class="cell ...
- css中,设置百分比后,让百分比的宽度包括padding和border来计算
*{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
随机推荐
- yii2 linux安装教程
安装扩展 安装Yii最好的方式就是使用Composer安装,所以我们需要安装Composer,但是为了安装Composer,我们需要安装一下关于Composer和Yii2的许多扩展包,别担心下面的教程 ...
- Apache-POI 简单应用
测试的Excel文件为四列的普通表格 jar包:poi-3.15-beta2.jar(Office2003xls文件).poi-ooxml-3.15-beta2.jar(Office2007xlsx文 ...
- swift的arc 是不是有问题?
class Arctest { let name: String = "Arctest" @lazy var ret:() -> String? = { [weak self ...
- 遁入NOIP记
回归noip啦 给自己定个小目标 500分起步 在这里列一下需要搞的东西OvO 1.算法基础 模拟 贪心 二分 分治 2.搜索 / 记忆化搜索 剪枝 对抗搜索 3.dp 状压 组合数学 树D 单队 D ...
- CodeForces 547E:Mike and Friends(AC自动机+DFS序+主席树)
What-The-Fatherland is a strange country! All phone numbers there are strings consisting of lowercas ...
- 「UVA11181」 Probability|Given(概率
题意翻译 有n个人要去买东西,他们去买东西的概率为p[i]. 现在得知有r个人买了东西,在这种条件下,求每个人买东西的概率. 感谢@s_r_f 提供翻译 题目描述 PDF 输入输出格式 输入格式: 输 ...
- Codeforces 755B. PolandBall and Game 贪心
题目大意: 有两个人轮流说单词,已经说过的单词不能再说.给出两人掌握的不同的单词,两人可能掌握相同的单词,但是这个单词也只能说一边.问在两人都是最优策略下先手是否必胜. 题解: 我们发现最优策略一定是 ...
- requirejs的打包工具r.js
不建议用命令行,还是用配置文件比较方便--build.js. 我的build.js文件内容大概如下: ( { appDir : './', baseUrl : './scripts', dir : ' ...
- bzoj 2946 公共串 —— 后缀自动机
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=2946 建出 n-1 个后缀自动机一起跑呗. 代码如下: #include<cstdio ...
- codevs2189数字三角形w——最优性转化
题目:http://codevs.cn/problem/2189/ 通过增加一维,将最优性转化为可行性. 代码如下: #include<iostream> #include<cstd ...