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

<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. Java 406

    项目改名之后, 项目上传后,报错,406,可是项目本地是可以跑起来的, 联系管理员,管理员改了个/etc/httpd/conf/workers2.properties 里面,将本次的项目加入进去就OK ...

  2. PHP 通过随机数获得ASCII 值返回字符。

    for($i=0;$i<20;$i++){ $Matrix .= chr(65 + rand(0,26)); }

  3. webGIS（离线版）研究路线归总

    特注:不做详解,说明网上资源很多,找一篇,照着走一遍即可. 1.数据源要满足开源.Free且地理信息要完善 几经周折,选择了OSM,具体信息可以去其官方查看(它竟然把中国一分为二,大陆.台湾,坑爹!! ...

  4. sed 简明教程

    做个标记 http://coolshell.cn/articles/9104.html sed全名叫stream editor,流编辑器,用程序的方式来编辑文本,相当的hacker啊.sed基本上就是 ...

  5. extjs中gridpanel动态显示/隐藏列

    在extjs3中,大家知道用 myGrid.getColumnModel().setHidden(i,true);但到了4.0后,已经没有getColumnModel这个方法了,我们在Ext.pane ...

  6. YII 框架使用之——创建应用

    linux环境为UBUNTU14.04,YII框架的版本是1.1.17 将下载的YII解压缩,压缩后会有三个文件夹,”demos,requirements,framework”,demos 当然就是演 ...

  7. [Android1.5]TextView跑马灯效果

    from: http://www.cnblogs.com/over140/archive/2010/08/20/1804770.html 前言 这个效果在两周前搜索过,网上倒是有转载,可恨的是转载之后 ...

  8. python【第三篇】函数

    内容大纲: 1.函数基本语法与特性 2.参数与局部变量 3.返回值 4.递归 5.匿名函数lambda 6.函数式编程介绍 7.高阶函数 8.内置函数 1.函数基本语法与特性 函数的定义:函数是指将一 ...

  9. android 开源项目学习

    1.Android团队提供的示例项目 如果不是从学习Android SDK中提供的那些样例代码开始,可能没有更好的方法来掌握在Android这个框架上开发.由Android的核心开发团队提供了15个优 ...

  10. 黑马程序员—C语言的特点和关键字

    ------Java培训.Android培训.iOS培训..Net培训.期待与您交流! ------- C语言的简介 一. C语言具有下列特点: C语言既具有低级语言直接操纵硬件的特点,又具有高级语言 ...