来源忘记哪的了，我稍微做了点修改，想了想还是挂了转载的标签，嗯嗯：

<html>

<head>

<title>EXAMPLE</title>

</head>

    <body>

        <p>可以根据自己要求修改css样式<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">点击这里打开窗口</a></p>

        <div id="light" style="display:none;position:absolute;top: 25%;left:25%; width:50%;height:50%;padding:16px;border:16px solid orange;background-color:white;z-index:2;overflow:auto;">

         This is the lightbox content.

        <a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a>

        </div>

        <div id="fade" style="display:none;position:absolute;top:0%;left:0%;width:100%;height:100%;background-color:black;z-index:1;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);">

        </div>

    </body>

</html>

[转载][HTML] 普通的DIV分层以及版透明效果的更多相关文章

  1. 纯CSS制作加<div>制作动画版哆啦A梦

    纯CSS代码加上<div>制作动画版哆啦A梦(机器猫) 哆啦A梦(机器猫)我们大家一定都很熟悉,今天给大家演示怎么用纯CSS代码,来做一个动画版的哆啦A梦. 效果图: ###下面代码同学可 ...

  2. Unity Shader入门精要学习笔记 - 第8章 透明效果

    转载自 冯乐乐的 <Unity Shader入门精要> 透明是游戏中经常要使用的一种效果.在实时渲染中要实现透明效果,通常会在渲染模型时控制它的透明通道.当开启透明混合后,当一个物体被渲染 ...

  3. Css实现透明效果，兼容IE8

    Css实现透明效果,兼容IE8 >>>>>>>>>>>>>>>>>>>>> ...

  4. 专题：DUILIB Win32 透明效果

    Win32 透明效果相关基础知识 Layered Windows 分层窗口.这是Windows2000开始引入的概念,重新定义了窗口的Hit Testing方法,以前都是把窗口按rectangle的方 ...

  5. Unity Shader 之 透明效果

    透明效果 透明效果一般有两种实现方法: 第一种,使用透明度测试(Alpha Test) 第二种,使用透明度混合(Alpha Blending) 透明度测试和透明度混合机制: 透明度测试(Alpha T ...

  6. 通过IE私有滤镜让IE6 7 8支持背景透明，内容不透明效果。

    CSS3已经支持背景rgba的rgba透明度,这一方法可以避免元素内容也随背景一起变透明(详情请阅http://www.cssha.com/css3-new-knowledge-student).但是 ...

  7. Android课程---Android设置透明效果的三种方法（转）

    1.使用Android系统自带的透明效果资源 <Button  android:background="@android:color/transparent"/>   ...

  8. DIV实现CSS 的placeholder效果

    placeholder是HTML5中input的属性,但该属性并不支持除input以外的元素   但我们可以使用Css before选择器来实现完全相同的效果 <!DOCTYPE html> ...

  9. js div浮动层拖拽效果代码

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

随机推荐

  1. 响应式WEB设计

    近期在学习有关响应式设计的内容,对此做了些整理,图片来源于网络,附上自己做的简单demo,没有js,只用CSS做了简单的搭建http://y.zhso.net/. 1.为什么需要响应式web设计 出于 ...

  2. WPF 媒体播放器（MediaElement）实例，实现进度和音量控制

    WPF 视频音频播放控件MediaElement实现进度控制,音量控制实例 说明: 1.Volume控制音量的大小,double类型,并且实现了属性依赖,可以用来双向绑定:在 0 和 1. 之间的线性 ...

  3. ^(bitwise exclusive Or).

    一个数,进行异或同一个数两次,将得到原来的数,例如: 6 ^ 4 ^ 4 = 6; 0000-0000-0000-0110 ^ 0000-0000-0000-0100 ---------------- ...

  4. 如何利用C#编写网页投票器程序 如何使用代理来投票 代理IP来投票

      一.前言看个图,了解下投票的过程.提交投票信息投票页 ――――――――>投票信息处理页反馈投票结果(请求页)<―――――――(响应页)一般情况下,填写投票信息,然后点提交按钮发送到响应 ...

  5. sqlserver触发器如何将一个库中的数据插入到另外一个库中

    需求:实现的功能就是,查询当前表的所有信息,插入到另外一个库中(同一台机器,同一个SqlServer) 解决:insert into dB2.dbo.TB2 select * from db1.dbo ...

  6. express 安装与卸载

    卸载: npm uninstall -g express安装指定版本: npm install -g express@3.5.0查看版本: express -V注意express -V中的V要大写,不 ...

  7. POJ 3468.A Simple Problem with Integers 解题报告

    用树状数组和线段树会比较简单,这里用这道题来学习Splay. 第一次写,代码比较丑 /* 初始化添加一个key值足够大的结点 保证每个需要的结点都有后继 */ #include <iostrea ...

  8. java中jdk环境配置

    配置java环境,俗称jdk环境 首先进入配置环境的目录下:右键鼠标我的电脑->属性->高级系统设置->环境变量,在对应的"系统变量"框下配置一下变量: 规范的配 ...

  9. CSAPP LAB: Buffer Overflow

    这是CSAPP官网上的著名实验,通过注入汇编代码实现堆栈溢出攻击.实验材料可到我的github仓库 https://github.com/Cheukyin/CSAPP-LAB/ 选择buffer-ov ...

  10. Android与Asp.Net Web服务器的文件上传下载BUG汇总[更新]

    遇到的问题: 1.java.io.IOException: open failed: EINVAL (Invalid argument)异常,在模拟器中的sd卡创建文件夹和文件时报错 出错原因可能是: ...