Html
    Css
    Js

    
                        
.overCurtain {
	border-top:1px solid rgb(230,245,255);
	position:absolute;
	height:674px;
	width:100%;
	left:0px;
	top:0px;
	opacity:0.7;
	display:none;
	background-color:rgb(230,245,255);
}
.hide-center {
	width:308px;
	height:300px;
	position:absolute;
	right:0;
	left:0;
	bottom:0;
	top:0;
	margin:auto;
	display:none;
	z-index:1;
}
.hide-center #formhead {
	width:300px;
	height:42px;
	margin:0;
	padding-top:12px;
	padding-bottom:-30px;
	border-top-left-radius:10px;
	border-top-right-radius:10px;
	background-color:#101010;
}
.hide-center #formhead-title {
	width:100px;
	height:24px;
	margin-left:106px;
	margin-right:36px;
	color:#bfbfbf;
	font-weight:900;
	display:inline-block;
}
.hide-center #close {
	width:35px;
	height:20px;
	border:0;
	border-radius:20%;
	background-color:red;
	color:white;
	display:inline-block;
}
.hide-center #formbody {
	width:300px;
	height:245px;
	background-color:#1e1e1e;
	border-bottom-left-radius:10px;
	border-bottom-right-radius:10px;
}
.hide-center .loginHead {
	margin-right:-8px;
	padding:13px;
	width:25px;
	height:28px;
	background-color:#141414;
	vertical-align:middle;
}
.hide-center .loginInput {
	height:52px;
	width:230px;
	padding-left:10px;
	border:0;
	background-color:#141414;
	color:aliceblue;
}
.hide-center .loginUserName {
	padding-left:30px;
	padding-top:30px;
}
.hide-center .login1 #img-topleft-loginHead {
	border-top-left-radius:5px;
}
.hide-center .login1 #input-topright-loginInput {
	border-top-right-radius:5px;
}
.hide-center .login1 #img-bottomleft-loginHead {
	border-bottom-left-radius:5px;
}
.hide-center .login1 #input-bottomright-loginInput {
	border-bottom-right-radius:5px;
}
.hide-center .loginPassword {
	padding-left:30px;
}
.hide-center #formfoot {
	margin-top:30px;
	margin-left:30px;
}
.hide-center #BSignIn {
	border:0;
	background:#329d90;
	color:#ffffff;
	width:240px;
	height:40px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
}

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

简单的登录框弹出层

点击登录按钮即可看到登录框 这个登录框每一个元素都是分隔开的 阔以直接拿去用的

5
      优秀.0
      2019/12/5 9:15:46
      棒嗷,正好用的着弹框 改下样式什么的就能直接套用了 回复
      风御浪0
      2019/8/2 14:33:03
      妖妖灵0
      2017/11/3 10:43:03

      我放到ASP.Net 里面调用脚本文件不显示,只有复制你的那个网址才会一闪而过

      回复
      deinfo@163.com0
      2017/9/13 1:43:00
      Issacl0
      2017/6/8 11:41:14