<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<!-- ===============================css文件=================================== -->
<style type="text/css">
.main{
position:absolute;
top:50%;
left:50%;
width:200px;
height:100px;
margin-top:-50px;
margin-left:-100px;
border:1px solid red;
line-height:30px;
font-size:16px;
text-align:center;
}
</style>
</head>
<body>
<div class="main" id="main" style="display:none;">
</div>
<div style="border:1px solid #9bdf70;background:#f0fbeb;width:1000;height:100;">
点击按钮在屏幕正中央弹出一个div层。
</div>
<input type="button" onclick="show()" value="show">
<input type="button" onclick="hide()" value="hide">
<!-- ===============================js文件=================================== -->
<script type="text/javascript">
function show(){
//显示
document.getElementById("main").style.display='inline';
}
function hide(){
//隐藏
document.getElementById("main").style.display='none';
}
</script>
</body>