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

<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. 11月15日jquery学习笔记

    1.属性 jQuery对象是类数组,拥有length属性和介于0~length-1之间的数值属性,可以用toArray()方法将jQuery对象转化为真实数组. selector属性是创建jQuery ...

  2. 访问nginx提示gateway timeout 504 ，发现总是当调用时间超过30s时提示504错误

    解决办法: 需要修改php-fpm的配置文件 request_terminate_timeout=30s 参考文档: http://baike.baidu.com/view/641394.htm ht ...

  3. windows 20003 扩展安装后不成功的原因

    windows扩展如果安装不成功(PHP扩展)很大的可能就是那个DLL的权限不够.需要分配:AdministratorAuthenticater UsersIIS_WPGSYSTEMUsers

  4. iOS里面消除使用代理调用方法时间警告问题

    iOS里面有三种调用函数的方式: 直接调用方法   [对象名 方法]; performselector:    [对象名 perform方法]; NSInvocation     调用 在使用代理调用 ...

  5. wpf 中DataGrid 控件的样式设置及使用

    本次要实现的效果为: 这个DataGrid需要绑定一个集合对象,所以要先定义一个Experience类,包含三个字段 /// <summary> /// 定义工作经历类 /// </ ...

  6. 获取C++类成员变量的地址偏移

    今天有在校学生问怎么获取类中的成员变量的地址偏移量,这个应该是很多初学C++的人很好奇的问题.以前我在学校的时候,也有过这种需求.忘了当时是要写什么“奇怪的程序”了,反正需要获取一个类的成员变量的地址 ...

  7. windows API 统计系统字体

    最近工作中遇到一个需求,需要统计当前系统中包含的所有字体.在网上逛了一圈后发现了EnumFontFamiliesEx这个API好像就可以实现这个功能.这里将自己对这个API的理解做一个记录,算是对这块 ...

  8. 读书笔记之 - javascript 设计模式 - 单体模式

    单体是一个用来划分命名空间,并将一批相关方法和属性组织在一起的对象,如果它可以被实例化,那么它只能被实例化一次. 单体模式,就是将代码组织为一个逻辑单元,这个逻辑单元中的代码可以通过单一的变量进行访问 ...

  9. java编码转化方案-备用

    import java.io.UnsupportedEncodingException; /** * 转换字符串的编码 */ public class changeCharSet { /** 7位AS ...

  10. Debian 8.0(Jessie) 无线网卡，ATI显卡驱动和输入法等安装记录。

    转载请注明作者与出处!谢谢! 最近准备彻底转换到Linux平台,之前一直用的是Red Hat,对Debian不是很熟悉,花了不少时间摸索.下面记录一下安装的过程以便备忘,顺便给他人能做个参考. 我的是 ...