Html
    Css
    Js

    
                        
html,body {
	height:100%;
}
body {
	margin:0;
	width:100%;
	display:flex;
	justify-content:center;
	align-items:center;
	color:#fff;
}
button {
	width:200px;
	height:50px;
	border:none;
	font-size:1rem;
	color:#fff;
}
button {
	background-color:#7FCFF7;
}
input {
	background-color:#FF9933;
	border:none;
	height:30px;
	width:50px;
	position:absolute;
	bottom:5px;
	right:5px;
	color:#fff;
}
div {
	display:none;
	width:400px;
	height:200px;
	background-color:lightpink;
	position:absolute;
	top:0px;
	left:calc(50% - 200px);
	text-align:center;
	/*line-height:200px;
	*/
				font-family:"微软雅黑";
	font-size:1.2rem;
}
span {
	position:absolute;
	top:5px;
	right:10px;
	cursor:pointer;
}
p {
	margin-top:70px;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.11.3
 立即下载

简单的原生js弹出框

代码简单,直接复制即可使用

0