设置div的背景为半透明,下面有个不错示例,使用div+css来实现下,不会的朋友可以参考下

div{filter:alpha(Opacity=80);-moz-opacity:0.5;opacity: 0.5;}

说明: 
1、filter:对win IE设置半透明滤镜效果,filter:alpha(Opacity=80)代表该对象80%半透明,火狐浏览器不认 
2、-moz-opacity:对mozilla firefox火狐浏览器实现半透明,win IE不认此属性,-moz-opacity:0.5相当于设置半透明为50% 
3、opacity:对除IE外所有浏览器支持包括谷歌,放最后主要针对谷歌浏览器,opacity: 0.5;表示设置50%半透明

为了观察到对DIV半透明实现,我们设置两个DIV层,分别一个放于另外一个DIV层内,外层DIV命名为“.div-a”;上面被包含的层CSS类命名为“.div-b”,形成“.div-b”盒子放于“.div-a”内

我们对底层DIV设置一个背景是一张图片,上面的DIV盒子设置村黑色。

使用css让div半透明的更多相关文章

  1. css 设置div半透明 悬浮在页面底部 不随滚动条滚动

    .action-button { width: 100%; background:rgba(0,0,0,0.7); position:fixed; bottom:; left:; z-index:; ...

  2. CSS实现文字半透明显示在图片上方法

    CSS实现文字半透明显示在图片上方法 在css中文字半透明我们会需要使用滤镜效果也就是css中的filter:alpha来实现了,下面来看两个文字显示在图片上并且半透明的例子. CSS让一行文字显示在 ...

  3. CSS之div和span标签

    div和span是非常重要的标签,div的语义是division"分割": span的语义就是span"范围.跨度". 这两个东西,都是最最重要的"盒 ...

  4. css实现div的高度填满剩余空间

    css实现div的高度填满剩余空间 .top{ width: 100%; height: 70px;} .bottom{background-color: #cc85d9;width: 100%;po ...

  5. html中css、div命名规范

    html中css.div命名规范 1.类class的命名规范示例 头:header 内容:content/container 尾:footer 导航:nav 侧栏:sidebar 栏目:column ...

  6. CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容

    CSS实现Div透明,而显示在上面的文字不透明,但也可看到显示在下面的图片内容,DiV透明其实挺简单,主要是为background定义opacity属性,一般这个是最大值是1,数值越接近1,则越不透明 ...

  7. CSS实现div居中

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  8. css与div小结

    前些时间学习css与div的课程 什么是css呢 Css 级联样式表或层叠样式表(Cascading Style Sheet) 是能够真正做到 网页表现与内容分离的一种样式设计语言.相对于传统HTML ...

  9. css让div水平垂直居中

    示例1: .div1{ width:200px; height:300px; border:1px solid #000; position: relative; } .div2{ width: 40 ...

随机推荐

  1. 全文检索原理以及es

    最近要做个文章搜索,对全文检索原理以及es原理进行了一些调研, 1.  es索引文件为多个文本文件描述,索引文件中的内容构成可见 http://elasticsearch.cn/article/86 ...

  2. 数学 SRM 690 Div1 WolfCardGame 300

    Problem Statement      Wolf Sothe and Cat Snuke are playing a card game. The game is played with exa ...

  3. Service Locator 服务定位模式

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  4. C#导入导出数据你该知道的方法。

    导入数据 using NPOI.HSSF.UserModel; using NPOI.SS.UserModel; using NPOI.XSSF.UserModel; using System; us ...

  5. Spring和Struts2整合

    目的:spring容器管理Action类,代替Servlet 步骤:主要在配置文件 Struts2: 添加支持spring的jar包, 配置<action class="Action类 ...

  6. 对比SerialCommunication和微软的SerialPort,向SerialPort看齐

    SerialCommunication是我综合网上看到的代码稍作修改而成的串口通信类,而SerialPort则是C#的System类库的IO目录Ports子目录下的串口通信类.SerialCommun ...

  7. POST在发送数据的时候使用的是HTTP命令

    防止SQL注入 SQL(结构化查询语言)是基于美国国家标准学会(ANSI)标准,并作为共同的语言与数据库通信.每个数据库系统增加了一些专有功能到基本的ANSI SQL. SQL注入是一门将制作好的SQ ...

  8. virtualenv

    问题:python开发过程中,需要安装各类依赖 逐个安装依赖,操作复杂,并可能会出现版本不一致的问题 解决:virtualenv可以有效解决上述问题 使用方法: 安装: pip install vir ...

  9. Python强化训练笔记(七)——使用deque队列以及将对象保存为文件

    collections模块中的deque对象是一个队列,它有着正常队列的先进先出原则.我们可以利用这个对象来实现数据的保存功能. 例如,现有一个猜数字大小的游戏,系统开始会随机roll点一个0-100 ...

  10. redis原子性读写操作之LUA脚本和watch机制

    最近在开发电商平台的子系统--储值卡系统,系统核心业务涉及到金额消费以及库存控制,因此为了解决建立在内存上高并发情况下的事务控制,使用了spring封装的RedisTemplate执行lua脚本进行原 ...