html网页比例,HTML弹出透明层事例大小可以设置也可以比例化

复制代码代码如下:

LIGHTBOX EXAMPLE

* {

margin:0;

padding:0

}

html, body {

height: 100%;

width: 100%;

font-size:12px

}

.white_content {

display: none;

position: absolute;

top: 25%;

left: 25%;

width: 50%;

padding: 6px 16px;

border: 12px solid #D6E9F1;

background-color: white;

z-index:1002;

overflow: auto;

}

.black_overlay {

display: none;

position: absolute;

top: 0%;

left: 0%;

width: 100%;

height: 100%;

background-color:#f5f5f5;

z-index:1001;

-moz-opacity: 0.8;

opacity:.80;

filter: alpha(opacity=80);

}

.close {

float:right;

clear:both;

width:100%;

text-align:right;

margin:0 0 6px 0

}

.close a {

color:#333;

text-decoration:none;

font-size:14px;

font-weight:700

}

.con {

text-indent:1.5pc;

line-height:21px

}

function show(tag){

var light=document.getElementById(tag);

var fade=document.getElementById('fade');

light.style.display='block';

fade.style.display='block';

}

function hide(tag){

var light=document.getElementById(tag);

var fade=document.getElementById('fade');

light.style.display='none';

fade.style.display='none';

}

打开1

打开2

关闭

内容1 内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容内容

关闭

内容2

代码全在上面了，可以复制试试...弹出层的大小可以设置，也可以比例化