使用CSS和JavaScript创建模态弹出框该怎么办

这个简单，给你一段简单的示例代码，你可以参考下：

html+css部分：

JavaScript部分：

运行效果

代码也给你放上来，你自己复制过去运行看效果吧

body,html{margin:0px;padding:0px;}

div.dialog{width:500px;height:300px;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;

background:white;top:50%;margin-left:-250px;left:50%;margin-top:-150px;position:relative;box-sizing:border-box;}

#container{width:100%;height:100%;position:fixed;filter:alpha(opacity=50);

background-color:rgba(0,0,0,.5);left:0px;top:0px;display:none;}

#close_btn{font:bold28px/30px"microsoftyahei";color:darkgrey;float:right;margin-right:5px;cursor:pointer;}

#open_diaog{border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;height:50px;width:150px;border:0px;

background:deepskyblue;font:bold6px/21px"microsoftyahei";cursor:pointer;}

打开模态对话框

×

我是模态对话框

有问题记得追问我，觉得不错的点个赞，蟹蟹支持。