每次做弹窗都伤脑筋，终于发现了一个大同小异的模板

css样式差不多就是这样，至于margin-left和margin-top的px就是div的width和height/2了

这就是绝对居中的样式，z-index自己设置

#div1 {
 position:absolute;
 top: 50%;
 left: 50%;
 margin-left:-250px;
 margin-top:-150px;
 width:500px;
 height:300px;
 z-index:1;
 border:solid #7A7A7A 4px; 
}

网页就是这个样子，也是从网上copy的，随手修改

<span style="cursor:pointer" id="span1">点我弹出div</span>


<div id="div1">
  <div align="right" style="background-color:#CDCDCD;">
  <span id="span2" style="cursor:pointer">关闭</span>
  </div>
  <p><p>
<form>

姓名:<input  type="text"/><p />

年龄:<input  type="text"/><p />

<input  type="submit" value="submit"/><br />

</form>

</div>

jquery或者js 随便写大概就是这样

$(function(){
           $("#div1").hide(); //先让div隐藏
            $("#span1").click(function(){
                  $("#div1").fadeIn("slow");//淡入淡出效果 显示div
            });
            $("#span2").click(function(){
                     $("#div1").fadeOut("slow");//淡入淡出效果 隐藏div
            })
        });

以上就可以弹出绝对中div，希望可以帮到大家，当然有了居中 就可以想去哪里就去哪里