帝国CMS电脑手机数据同步仿站全套高清视频教程在线观看
织梦dede电脑手机数据同步仿站全套高清视频教程在线观看
软件下载| 立即登陆| 注册新账号| 淘宝店铺

大小:437 KB
当前版本:V2.2
更新时间:2020.6.14

当前位置: 主页 > 常见问题 > 建站技术问题 >
登陆高档弹窗的制作原理代码
发布者:admin  时间:2020-07-24 14:34  已阅读:

登陆高档弹窗的制作原理代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
 
<style type="text/css">
 
#tanchuang{ 
width:600px; 
height:450px; 
margin-left:-300px; /*设置为宽度的一半*/
margin-top:-225px; /*设置为高度的一半*/
background:#FFF;   /*弹窗背景色*/ 
left:50%; 
top:50%;
display: none; /*弹窗默认不显示*/
border:8px solid #999; /*弹窗边框*/
position: absolute;z-index:1002;
}
 
#tanchuang .donglutitle{ 
height:90px; 
background:#CCC; 
float:left;
width:100%;
line-height:90px; 
color: #333333;
font-family: '微软雅黑';
font-size: 26px;
font-weight: normal;}
 
        .close_css{ 
            display: none; 
            position: absolute; 
            top: 0%; 
            left: 0%; 
            width: 100%; 
            height: 100%; 
            background-color: #000; /*弹窗遮照层色*/ 
            z-index:1001; 
filter:alpha(opacity=50); /*IE滤镜,透明度50%*/
-moz-opacity:0.5; /*Firefox私有,透明度50%*/
opacity:0.5;/*其他,透明度50%*/
        } 
 
</style>
 
</head>
 
<body>
 
 
<a href="javascript:void(0)" onclick = "document.getElementById('tanchuang').style.display='block';document.getElementById('close').style.display='block'">会员注册</a>
 
<!--弹窗框开始-->
<div id="tanchuang">
<div class="donglutitle">会员登陆</div>
<a href="javascript:void(0)" onclick = "document.getElementById('tanchuang').style.display='none';document.getElementById('close').style.display='none'">点我关闭</a><br/>
 
我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内我是内要放的内
 
</div>
<!--弹窗框结束-->
 
<!--弹窗后面灰色遮照层样式开始-->
<div id="close" class="close_css"></div>
<!--弹窗后面灰色遮照层样式结束-->
 
</body>
</html>

 
 

帝国CMS电脑手机数据同步仿站全套高清视频教程在线观看
相关新闻