webfront / videoWeb · 提交

转到一个项目

作者 乔爽
提交 2b726d532cf8f9a9c330e1952ff8f36107773da0 1 个父辈 496de973

update

内嵌 并排对比
正在显示 11 个修改的文件 包含 1764 行增加 和 19 行删除
.container {
width: 100%;
display: flex;
flex-flow: column;
align-items: center;
justify-content: center;
}
.top{
width: 7.5rem;
/*height: 1.5rem;*/
background-color: #F7F7F7;
display: flex;
flex-flow: column;
align-items: center;
justify-content: center;
}
.top_t{
width: 6.86rem;
height: 0.8rem;
display: flex;
align-items: center;
justify-content: space-between;
}
.top_t_left{
width: 1.2rem;
display: flex;
justify-content: space-between;
align-items: center;
}
.top_t_left_text{
font-size:0.3rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(166,16,16,1);
}
.icon-caidan{
}
/*中部*/
.top_t_middle{
width: 1.2rem;
height: 0.5rem;
display: flex;
}
.top_t_middle img{
width: 100%;
height: 100%;
}
/*右边*/
.top_t_right{
width: 1.2rem;
display: flex;
justify-content: space-between;
align-items: center;
}
.icon-10{
position: relative;
}
.top_t_right_pic{
width: 0.4rem;
height: 0.4rem;
display: flex;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
.top_t_right_pic img{
width: 100%;
height: 100%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
/*-----底部------*/
.top_d{
width: 5.56rem;
display: flex;
padding-bottom: 0.03rem;
border-bottom: 1px solid #999999;
margin: 0.3rem 0 0.2rem 0;
}
.top_d_input{
width: 5rem;
text-align: center;
border: none;
outline: none;
background-color: #F7F7F7;
font-size: 0.3rem;
box-sizing: border-box;
padding: 0 0.2rem;
}
.top_d_input::placeholder{
color: #999999;
}
.mid{
width: 6.86rem;
display: flex;
flex-flow: column;
margin-top: 0.13rem;
}
.mid_head{
width: 6.86rem;
height: 3rem;
display: flex;
border-radius: 0.08rem;
}
.mid_head img{
width: 100%;
height: 100%;
border-radius: 0.08rem;
}
.mid_title{
margin-top: 0.6rem;
width: 6.84rem;
height: 2.83rem;
background:rgba(255,222,37,0);
border:1px solid rgba(232, 232, 232, 1);
border-radius: 0.1rem;
font-size: 0.24rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(51,51,51,1);
line-height: 0.36rem;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0.25rem 0.35rem 0.19rem 0.35rem;
overflow-y: scroll;
}
/*文本框下的介绍内容*/
.mid_small{
display: flex;
justify-content: center;
margin-top: 0.25rem;
}
.mid_small_left{
width: 0.6rem;
font-size: 0.18rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(153,153,153,1);
line-height: 0.3rem;
}
.mid_small_right{
font-size: 0.18rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(153,153,153,1);
line-height: 0.3rem;
}
.mid_type{
display: flex;
margin-top: 0.42rem;
flex-flow: column;
}
.mid_type_title{
width: 1rem;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 0.36rem;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
line-height: 0.3rem;
}
.mid_type_title_dot{
width: 0.14rem;
height: 0.14rem;
background:rgba(166,16,16,1);
border-radius:50%;
}
.mid_type_items{
width: 6rem;
display: flex;
flex-wrap: wrap;
margin-left: 0.4rem;
justify-content: space-between;
}
.mid_type_items_item{
width: 1.5rem;
height: 0.5rem;
background:rgba(166,16,16,0);
border:1px solid rgba(232, 232, 232, 1);
border-radius: 0.04rem;
line-height: 0.5rem;
text-align: center;
font-size: 0.24rem;
font-family:MicrosoftYaHei;
font-weight:400;
color:rgba(51,51,51,1);
margin-top: 0.2rem;
}
.mid_type_items_title{
width: 100%;
display: flex;
}
.mid_type_items_title input{
width: 100%;
}
... ...
... ... @@ -262,6 +262,7 @@
margin-top: 0.2rem;
display: flex;
justify-content: space-between;
position: relative;
}
.dynamic_item_title{
... ... @@ -278,6 +279,15 @@
font-weight:500;
color:rgba(153,153,153,1);
line-height: 0.3rem;
position: absolute;
right: 2rem;
}
.dynamic_item_date{
width: 1.8rem;
display: flex;
justify-content: space-around;
font-size: 0.24rem;
color: #333333;
}
.dynamic_name{
width: 5rem;
... ...
... ... @@ -6,6 +6,7 @@
flex-flow: column;
align-items: center;
justify-content: center;
overflow-y: hidden;
}
.top{
... ... @@ -51,7 +52,7 @@
}
/*右边*/
.top_t_right{
width: 1.2rem;
width: 1.5rem;
display: flex;
justify-content: space-between;
align-items: center;
... ... @@ -74,6 +75,11 @@
-moz-border-radius: 50%;
border-radius: 50%;
}
.top_t_right_text{
font-size: 0.2rem;
font-weight: 500;
color: #333333;
}
/*-----底部------*/
.top_d{
width: 5.56rem;
... ... @@ -243,3 +249,566 @@
line-height: 0.36rem;
}
/*动态层*/
.mask{
width: 7.5rem;
height: 100%;
position: fixed;
top: 1.69rem;
display: flex;
justify-content: center;
background:rgba(255,255,255,0.94);
margin-top: 0.46rem;
}
.mask_box{
width: 5.7rem;
height: 7rem;
display: flex;
flex-flow: column;
align-items: center;
background:rgba(255,255,255,1);
border-radius: 0.16rem;
box-shadow: 0 0.07rem 0.1rem 0.01rem rgba(0, 0, 0, 0.08);
}
.mask_text{
margin-top: 0.64rem;
font-size: 0.48rem;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
}
.mask_box_top{
margin-top: 0.64rem;
width: 3.5rem;
display: flex;
justify-content: space-between;
align-items: center;
}
.tel_size{
margin-top: 0;
font-size: 0.36rem;
}
.mask_email{
font-size: 0.24rem;
font-weight: bold;
color: #999999;
margin-top: 0.1rem;
}
.mask_box_mid{
margin-top: 0.9rem;
display: flex;
flex-flow: column;
position: relative;
}
.mask_box_text{
display: flex;
font-size: 0.24rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(51,51,51,1);
position: absolute;
left: -0.9rem;
top: 0.16rem;
align-items: center;
}
.mask_box_mid_input{
font-size: 0.24rem;
width: 3.5rem;
height: 0.6rem;
outline:none;
border: none;
text-decoration: none;
box-sizing: border-box;
padding: 0.1rem;
}
.mask_box_mid_input::placeholder{
color: #999999;
}
.mask_box_mid_input_code{
font-size: 0.16rem;
color: #A61010;
position: absolute;
top: 0.8rem;
right: 0;
}
.mask_box_sub{
margin-top: 0.53rem;
width: 3.5rem;
height: 0.5rem;
line-height: 0.5rem;
text-align: center;
background:rgba(192,44,44,1);
border-radius: 0.04rem;
font-size: 0.26rem;
font-weight: bold;
color: #fff;
}
.mask_box_account{
width: 3.5rem;
display: flex;
justify-content: space-between;
font-size: 0.14rem;
color: #333333;
margin-top: 0.28rem;
}
.mask_box_underline{
margin-top: 0.29rem;
width: 4.8rem;
height: 0.02rem;
background-color: #e8e8e8;
}
.mask_box_third{
font-size: 0.18rem;
text-align: center;
color: #333333;
margin-top: 0.23rem;
}
.mask_box_model{
width: 3.5rem;
margin-top: 0.7rem;
display: flex;
justify-content: space-between;
}
.mask_box_model_sub{
width: 0.4rem;
height: 0.4rem;
display: flex;
border-radius: 50%;
}
.mask_box_model_sub img{
width: 100%;
height: 100%;
border-radius: 50%;
}
.mask_box_bottom{
margin-top: 0.59rem;
width: 3.5rem;
font-size: 0.18rem;
font-family:MicrosoftYaHei;
font-weight:400;
color:rgba(153,153,153,1);
display: flex;
justify-content: space-between;
}
.mask_box_t{
font-size: 0.14rem;
color: #333333;
margin-top: 0.28rem;
}
/*立即登录，10秒后进入登录界面*/
.now_sub{
width: 7.5rem;
height: 100%;
position: fixed;
top: 1.69rem;
flex-flow: column;
display: flex;
align-items: center;
background:rgba(255,255,255,0.94);
}
.mask_big{
margin-top: 2.97rem;
font-size: 0.48rem;
font-weight: bold;
color: #333333;
}
.mask_small{
margin-top: 0.88rem;
font-size: 0.48rem;
font-weight: 500;
}
/*邮箱注册*/
.tel_register{
font-size: 0.24rem;
font-weight: bold;
color: #999999;
margin-top: 0.1rem;
}
.email_register{
font-size: 0.36rem;
font-weight: bold;
color: #333333;
}
.sub_verity{
margin-top: 0.3rem;
}
.mask_box_mid_input_remind{
font-size: 0.12rem;
position: absolute;
top: 0.86rem;
color: #999999;
}
.mask_underline{
height: 0.8rem;
}
.height_input{
margin-top: 0.18rem;
width: 3.6rem;
}
/*发送至邮箱*/
.mask_middle{
font-size: 0.36rem;
font-weight: bold;
margin-top: 1rem;
}
.mask_s{
font-size: 0.3rem;
margin-top: 0.8rem;
}
/*密码找回*/
.find{
margin-top: 0;
}
.mask_find{
margin-top: 3.04rem;
width: 5.3rem;
display: flex;
flex-flow: column;
}
.mask_find_big{
font-size: 0.48rem;
font-weight: bold;
color: #333333;
}
.mask_find_small{
margin-top: 0.21rem;
font-size: 0.3rem;
color: #333333;
}
.mask_find_box{
width: 5.3rem;
height: 0.86rem;
display: flex;
justify-content: space-between;
border-bottom: 1px solid #A61010;
margin-top: 0.5rem;
}
.mask_find_box_input{
width: 5.3rem;
font-size: 0.36rem;
color: #333333;
outline: none;
border: none;
background-color: transparent;
}
.mask_find_box_input::placeholder{
color: #999999;
}
/*下一步按钮*/
.mask_find_next{
margin-top: 0.79rem;
width: 5.3rem;
height: 0.6rem;
line-height: 0.6rem;
background:rgba(192,44,44,1);
border-radius: 0.04rem;
text-align: center;
font-size: 0.3rem;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(252,254,255,1);
}
/*验证手机有效性*/
.mask_find_box_small{
font-size: 0.24rem;
font-family:MicrosoftYaHei;
font-weight:400;
color:rgba(153,153,153,1);
line-height:36px;
}
/*手机号设置*/
.width_input{
width: 3rem;
}
.m_top{
margin-top: 0.7rem;
}
.mask_tel{
font-size: 0.48rem;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
/*line-height:24px;*/
margin-top: 1.03rem;
}
.mask_new{
font-size: 0.24rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(153,153,153,1);
/*line-height:24px;*/
height: 0.8rem;
display: flex;
border-bottom: 1px solid #e8e8e8;
}
.mask_box_i{
margin-top: 1rem;
}
.mask_new_input{
width: 4rem;
font-size: 0.24rem;
outline: none;
border: none;
}
.mask_new_input::placeholder{
color: #999999;
}
.mask_new_small{
width: 2.7rem;
font-size: 0.24rem;
outline: none;
border: none;
}
.mask_new_small::placeholder{
color: #999999;
}
.mask_new_text{
font-size: 0.24rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(51,51,51,1);
/*line-height:24px;*/
}
.border_no{
border: none;
display: flex;
align-items: center;
justify-content: space-between;
}
.mask_tel_button{
display: flex;
justify-content: space-between;
font-size: 0.29rem;
color: #ffffff;
margin-top: 1.32rem;
}
.mask_tel_button_left{
width: 1.9rem;
height: 0.5rem;
background:rgba(232,232,232,1);
border-radius: 0.04rem;
line-height: 0.5rem;
text-align: center;
}
.mask_tel_button_right{
width: 1.9rem;
height: 0.5rem;
background:rgba(192,44,44,1);
border-radius: 0.04rem;
line-height: 0.5rem;
text-align: center;
}
.mask_ver_button{
width: 4rem;
height: 0.5rem;
background:rgba(192,44,44,1);
border-radius: 0.04rem;
font-size: 0.3rem;
color: #ffffff;
margin-top: 1.1rem;
text-align: center;
line-height: 0.5rem;
}
/*设置昵称*/
.mask_name{
margin-top: 1.72rem;
width: 5.7rem;
height: 4.4rem;
background:rgba(255,255,255,1);
border-radius: 0.16rem;
display: flex;
flex-flow: column;
align-items: center;
box-shadow: 0 0.07rem 0.1rem 0.01rem rgba(0, 0, 0, 0.08);
}
.mask_name_title{
margin-top: 0.65rem;
font-size: 0.48rem;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
/*line-height:24px;*/
}
.mask_name_input{
height: 0.8rem;
width: 4.3rem;
display: flex;
border-bottom: 1px solid #e8e8e8;
margin-top: 0.5rem;
}
.mask_name_input input{
width: 100%;
border: none;
outline: none;
font-size: 0.24rem;
}
.mask_name_input input::placeholder{
color: #999999;
}
.mask_name_hint{
margin-top: 0.15rem;
width: 4.3rem;
font-size: 0.14rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(153,153,153,1);
/*line-height:36px;*/
}
.mask_name_sub{
margin-top: 0.5rem;
width: 4.2rem;
height: 0.5rem;
background:rgba(192,44,44,1);
border-radius: 0.04rem;
color: #ffffff;
font-size: 0.3rem;
line-height: 0.5rem;
text-align: center;
}
/*绑定手机号继续*/
.tel_height{
margin-top: 0.7rem;
height: 7rem;
}
.mask_tel_box{
display: flex;
align-items: center;
flex-flow: column;
}
.mask_tel_box p{
margin-top: 0.23rem;
font-size: 0.24rem;
color: #333333;
text-align: center;
}
.mask_tel_box_pic{
margin-top: 0.44rem;
width: 1rem;
height: 0.99rem;
border-radius: 0.5rem;
}
.mask_tel_box_pic img{
width: 100%;
height: 100%;
border-radius: 0.5rem;
}
.margin_to{
margin-top: 0.9rem;
}
.mask_jump{
margin-top: 0.55rem;
font-size: 0.18rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(153,153,153,1);
/*line-height:24px;*/
}
.mask_name_way{
margin-top: 1.09rem;
font-size: 0.24rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(51,51,51,1);
line-height: 0.24rem;
}
.way_top{
margin-top: 0.97rem;
}
/*解绑账号2*/
.mask_way_sub{
width: 4rem;
display: flex;
justify-content: space-between;
margin-top: 0.96rem;
}
.mask_way_sub_left{
width: 1.9rem;
height: 0.5rem;
line-height: 0.5rem;
background:rgba(232,232,232,1);
border-radius: 0.04rem;
font-size: 0.3rem;
color: #ffffff;
text-align: center;
}
.mask_way_sub_right{
width: 1.9rem;
height: 0.5rem;
line-height: 0.5rem;
background:rgba(192,44,44,1);
border-radius:4px;
font-size: 0.3rem;
color: #ffffff;
text-align: center;
}
.submit_height{
margin-top: 2.02rem;
height: 3rem;
}
.mask_submit_text{
display: flex;
flex-flow: column;
font-size: 0.3rem;
color: #333333;
margin-top: 0.73rem;
}
.mask_submit_bottom{
margin-top: 0.43rem;
width: 2.5rem;
height: 0.5rem;
background:rgba(192,44,44,1);
border-radius: 0.04rem;
line-height: 0.5rem;
text-align: center;
font-size: 0.26rem;
color: #ffffff;
}
/*隐私协议*/
.mask_title{
font-size: .48rem;
font-family:PingFang-SC-Bold;
font-weight:bold;
color:rgba(51,51,51,1);
}
.mask_small_text{
font-size: 0.24rem;
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(51,51,51,1);
line-height: 0.36rem;
padding: 0.3rem 0.5rem;
margin-bottom: 2rem;
}
.privacy{
/*display: flex;*/
/*flex-flow: column;*/
}
.mask_box_a{
display: flex;
flex-flow: column;
align-items: center;
overflow-y: auto;
margin-bottom: 0.6rem;
}
... ...
... ... @@ -185,7 +185,7 @@
.bottom_item{
margin-top: 0.07rem;
display: flex;
flex-wrap: wrap-reverse;
flex-wrap: wrap;
justify-content: space-between;
margin-bottom: 0.6rem;
}
... ...
... ... @@ -2,8 +2,9 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<title>首页</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>个人主页</title>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/grzy.css">
... ...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>个人主页</title>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/gx.css">
<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_1037215_j5a2c541jh.css">
<script src="js/base.js"></script>
<script src="js/jquery.min.js"></script>
<style>
.icon-caidan{
font-size: 0.5rem;
}
.icon-magnifier{
color: #999999;
}
.f_size{
font-weight: normal;
font-size: 0.18rem;
}
.icon-xiugai{
margin-left: 0.15rem;
font-size: 0.3rem;
color: #999999;
display: flex;
font-weight: bold;
align-items: center;
}
.top_dot{
width: 0.08rem;
height: 0.08rem;
background:rgba(166,16,16,1);
border:1px solid rgba(255, 255, 255, 1);
border-radius: 50%;
position: absolute;
top: 0;
right: 0;
}
.color_black{
color: black;
}
.margin_t{
margin-top: 0.1rem;
}
</style>
</head>
<body>
<div class="container">
<div class="top">
<!--顶部菜单-->
<div class="top_t">
<!--左-->
<div class="top_t_left">
<!--中文字-->
<div class="top_t_left_text">
中
</div>
<!--菜单图标-->
<div class="iconfont icon-caidan"></div>
</div>
<!--中-->
<div class="top_t_middle">
<img src="images/peke.png">
</div>
<!--右-->
<div class="top_t_right">
<!--铃声-->
<div class="iconfont icon-10">
<!--小红点-->
<div class="top_dot"></div>
</div>
<!--头像-->
<div class="top_t_right_pic">
<img src="images/1.png">
</div>
</div>
</div>
<!--底部搜索-->
<div class="top_d">
<div class="iconfont icon-magnifier"></div>
<input class="top_d_input" placeholder="搜索音乐/作品/风格">
</div>
</div>
<!--主体内容-->
<div class="mid">
<!--头部图片-->
<div class="mid_head">
<img src="images/banner_1.png">
</div>
<!--头部文本框-->
<div class="mid_title">
我在这里享受着很多地区不曾有的体验，每一天都在过四季。为此，很是苦恼，不知道怎么穿戴，分不清是穿多了还是穿少了。这种特有的气候，每年都会让体弱的人进出医院好几回。年少时，总觉得那些因为天气而生病的人，是残弱群体，而今，自己也慢慢加入这个群体，深深懂得，岁月不会优待谁，生老病死都得走这么一遭。这么一说，我感到一丝悲哀
</div>
<!--文本框下的介绍内容-->
<div class="mid_small">
<!--图标-->
<!--<div class="iconfont icongantanhao"></div>-->
<div class="mid_small_left">图标</div>
<!--文字-->
<div class="mid_small_right">
<p>包含图片/声音/视频或大附件内容请直接发送邮件至：</p>
<p>Musicofchina@outlook.com (后期会改成企业邮箱）</p>
</div>
</div>
<!--类型-->
<div class="mid_type">
<!--标题-->
<div class="mid_type_title">
<!--圆点-->
<p class="mid_type_title_dot"></p>
<p>类型</p>
</div>
<!--内容-->
<div class="mid_type_items">
<div class="mid_type_items_item">人物</div>
<div class="mid_type_items_item">演出</div>
<div class="mid_type_items_item">文章</div>
<div class="mid_type_items_item">新闻</div>
<div class="mid_type_items_item">风格</div>
<div class="mid_type_items_item">乐器</div>
<div class="mid_type_items_item">其他</div>
</div>
</div>
<!--内容-->
<div class="mid_type">
<!--标题-->
<div class="mid_type_title">
<!--圆点-->
<p class="mid_type_title_dot"></p>
<p>类型</p>
</div>
<!--内容-->
<div class="mid_type_items">
<!--标题-->
<div class="mid_type_items_title">
<input type="text">
</div>
</div>
</div>
</div>
</div>
</body>
<script>
</script>
</html>
... ...
... ... @@ -3,7 +3,8 @@
<head>
<meta charset="UTF-8">
<title>首页</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
... ... @@ -333,8 +334,8 @@
},
});
$('.icon-magnifier').click(
window.location.href = 'grzy_1'
)
// $('.icon-magnifier').click(
// window.location.href = 'grzy_1'
// )
</script>
</html>
... ...
... ... @@ -3,7 +3,8 @@
<head>
<meta charset="UTF-8">
<title>首页</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<!--<meta name="viewport" content="width=device-width, initial-scale=1" />-->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/index.css">
... ...
... ... @@ -3,7 +3,8 @@
<head>
<meta charset="UTF-8">
<title>人物详情</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<!--<meta name="viewport" content="width=device-width, initial-scale=1" />-->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/rwxq.css">
... ... @@ -240,7 +241,12 @@
</div>
<div class="dynamic_item_time">
时间
<div class="dynamic_item_date"></div>
</div>
<div class="dynamic_item_date">
<p><</p>
<p>2018</p>
<p>></p>
</div>
</div>
<!--演出名称-->
... ... @@ -263,11 +269,16 @@
<!--事件-->
<div class="dynamic_item">
<div class="dynamic_item_title">
时间
事件
</div>
<div class="dynamic_item_time">
时间
<div class="dynamic_item_date"></div>
</div>
<div class="dynamic_item_date">
<p><</p>
<p>2018</p>
<p>></p>
</div>
</div>
<!--演出名称-->
... ... @@ -287,6 +298,7 @@
7月12日
</div>
</div>
</div>
<!------------ 作品 ------------>
<div class="production">
... ...
... ... @@ -3,11 +3,13 @@
<head>
<meta charset="UTF-8">
<title>用户展示页面</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<!--<meta name="viewport" content="width=device-width, initial-scale=1" />-->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/yhzs.css">
<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_1037215_aj31y803pii.css">
<!--<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_1037215_st61h4y4sf8.css">-->
<link rel="stylesheet" type="text/css" href="https://at.alicdn.com/t/font_1037215_qenn9ltnfx.css">
<script src="js/base.js"></script>
<script src="js/jquery.min.js"></script>
... ... @@ -47,6 +49,49 @@
.margin_t{
margin-top: 0.1rem;
}
.icon-jinlingyingcaiwangtubiao22{
margin-left: 0.1rem;
font-size: 0.12rem;
}
.tel_top{
margin-top: 0.33rem;
}
.tel_margin{
margin-top: 0.53rem;
}
.register{
margin-top: 0.3rem;
width: 3.6rem;
}
.mask_underline{
border-bottom: 1px solid #E8E8E8;
display: flex;
}
.big_box{
height: 7.6rem;
}
/*弹框*/
.pop_fn{
position: fixed;
top: -2rem;
left: 0;
right: 0;
width: 3.74rem;
height: 0.82rem;
margin: 0 auto;
text-align: center;
line-height: 0.82rem;
color: #fff;
font-size: 0.24rem;
/*background: #352D32;*/
background:rgba(0,0,0,0.4);
transition: 1.2s;
border-radius: 0.36rem;
}
.iconguanbi{
position: absolute;
}
</style>
</head>
... ... @@ -76,9 +121,13 @@
<div class="top_dot"></div>
</div>
<!--头像-->
<div class="top_t_right_pic">
<div class="top_t_right_pic" style="display: none;">
<img src="images/1.png">
</div>
<!--注册 在用户为注册登录的情况下展示-->
<div class="top_t_right_text">
注册/登录
</div>
</div>
</div>
<!--底部搜索-->
... ... @@ -152,10 +201,698 @@
</div>
</div>
<!--动态层 -> 密码登录-->
<div class="mask" style="display: none;">
<div class="mask_box">
<!--头部-->
<p class="mask_text">
密码登录
</p>
<!--中部输入信息栏-->
<div class="mask_box_mid ">
<div class="mask_box_text">+86
<div class="iconfont icon-jinlingyingcaiwangtubiao22"></div>
</div>
<input class="mask_box_mid_input" type="number" placeholder="手机号">
<input class="mask_box_mid_input" type="password" placeholder="密码">
</div>
<!--登录按钮-->
<div class="mask_box_sub">登录</div>
<!--五种登录模式-->
<div class="mask_box_model">
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
</div>
<!--忘记密码 & 立即注册-->
<div class="mask_box_bottom">
<div class="mask_box_bottom_text">
忘记密码
</div>
<div class="mask_box_bottom_text">
立即注册
</div>
</div>
</div>
</div>
<!--动态层 -> 手机号注册-->
<div class="mask" style="display: none;">
<div class="mask_box">
<!--头部-->
<div class="mask_box_top">
<p class="mask_text tel_size">
手机号注册
</p>
<p class="mask_email">
邮箱注册
</p>
</div>
<!--中部输入信息栏-->
<div class="mask_box_mid tel_margin">
<div class="mask_box_text">+86
<div class="iconfont icon-jinlingyingcaiwangtubiao22"></div>
</div>
<input class="mask_box_mid_input" type="number" placeholder="手机号">
<input class="mask_box_mid_input" type="number" placeholder="短信验证码">
<!--获取验证码-->
<span class="mask_box_mid_input_code">获取验证码</span>
<input class="mask_box_mid_input" type="password" placeholder="密码">
</div>
<!--登录按钮-->
<div class="mask_box_sub register">注册</div>
<!--已有账号，立即登陆-->
<div class="mask_box_account">
<p></p>
<p>已有账号?立即登录</p>
</div>
<!--下划线-->
<div class="mask_box_underline">
</div>
<!--使用第三方登录-->
<div class="mask_box_third">
使用第三方登录
</div>
<!--四种登录模式-->
<div class="mask_box_model tel_top">
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
</div>
<!--底部协议确定-->
<div class="mask_box_t">
注册表示您已阅读和同意《隐私协议》
</div>
</div>
</div>
<!--动态层 -> 邮箱登录-->
<div class="mask" style="display: none;">
<div class="mask_box">
<!--头部-->
<p class="mask_text">
邮箱登录
</p>
<!--中部输入信息栏-->
<div class="mask_box_mid ">
<input class="mask_box_mid_input" type="email" placeholder="邮箱">
<input class="mask_box_mid_input" type="password" placeholder="密码">
</div>
<!--登录按钮-->
<div class="mask_box_sub">登录</div>
<!--五种登录模式-->
<div class="mask_box_model">
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
</div>
<!--忘记密码 & 立即注册-->
<div class="mask_box_bottom">
<div class="mask_box_bottom_text">
忘记密码
</div>
<div class="mask_box_bottom_text">
立即注册
</div>
</div>
</div>
</div>
<!--动态层 -> 立即登录，10秒后进入登录页-->
<div class="now_sub" style="display: none;">
<div class="mask_big">
立即登录
</div>
<div class="mask_small">
10秒后进入登录界面
</div>
</div>
<!--动态层 -> 邮箱注册-->
<div class="mask" style="display: none;">
<div class="mask_box big_box">
<!--头部-->
<div class="mask_box_top">
<p class="tel_register">
手机号注册
</p>
<p class="email_register">
邮箱注册
</p>
</div>
<!--中部输入信息栏-->
<div class="mask_box_mid tel_margin">
<div class="mask_underline">
<input class="mask_box_mid_input height_input" type="number" placeholder="邮箱">
</div>
<span class="mask_box_mid_input_remind">
不超过8个中文，不超过12个英文字母，不能有除了_-以外的字符
</span>
<div class="mask_underline">
<input class="mask_box_mid_input height_input" type="number" placeholder="8个字符以内的名称">
</div>
<div class="mask_underline">
<input class="mask_box_mid_input height_input" type="password" placeholder="密码">
</div>
</div>
<!--登录按钮-->
<div class="mask_box_sub register">点击验证</div>
<!--已有账号，立即登陆-->
<div class="mask_box_account">
<p></p>
<p>已有账号?立即登录</p>
</div>
<!--下划线-->
<div class="mask_box_underline">
</div>
<!--使用第三方登录-->
<div class="mask_box_third">
使用第三方登录
</div>
<!--四种登录模式-->
<div class="mask_box_model tel_top">
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
<div class="mask_box_model_sub">
<img src="images/peke.png">
</div>
</div>
<!--底部协议确定-->
<div class="mask_box_t">
注册表示您已阅读和同意《隐私协议》
</div>
</div>
</div>
<!--动态层 -> 我们已向你的邮箱:xx发送-->
<div class="now_sub" style="display: none;">
<div class="mask_big">
我们已向你的邮箱:
</div>
<div class="mask_middle">
XXXXX发送一封验证邮箱
</div>
<div class="mask_s">
请进入邮箱查看邮件，完成邮箱验证
</div>
</div>
<!--动态层 -> 找回密码-->
<div class="mask find" style="display: none;">
<div class="mask_find">
<!--找回密码-->
<div class="mask_find_big">
找回密码
</div>
<div class="mask_find_small">
验证码将会发送到你的邮箱或者手机
</div>
<!--请输入手机号/邮箱-->
<div class="mask_find_box">
<input class="mask_find_box_input" placeholder="请输入手机号/邮箱">
</div>
<!--下一步-->
<div class="mask_find_next">
下一步
</div>
</div>
</div>
<!--动态层 -> 验证手机有效性-->
<div class="mask find" style="display: none;">
<div class="mask_find">
<!--找回密码-->
<div class="mask_find_big">
验证手机有效性
</div>
<div class="mask_find_small">
验证码已经发送至手机：13987654321
</div>
<!--请输入验证码-->
<div class="mask_find_box">
<input class="mask_find_box_input width_input" placeholder="请输入验证码">
<div class="mask_find_box_small">23秒后重新获取</div>
</div>
<!--请输入密码-->
<div class="mask_find_box">
<input class="mask_find_box_input" placeholder="请输入密码">
</div>
<!--下一步-->
<div class="mask_find_next">
下一步
</div>
</div>
</div>
<!--动态层 -> 验证邮箱有效性-->
<div class="mask find" style="display: none;">
<div class="mask_find">
<!--验证邮箱有效性-->
<div class="mask_find_big">
验证邮箱有效性
</div>
<div class="mask_find_small">
验证码已经发送至邮箱：maplestory@gmail.com
</div>
<!--请输入验证码-->
<div class="mask_find_box">
<input class="mask_find_box_input width_input" placeholder="请输入验证码">
<div class="mask_find_box_small">23秒后重新获取</div>
</div>
<!--请输入密码-->
<div class="mask_find_box">
<input class="mask_find_box_input" placeholder="请输入密码">
</div>
<!--下一步-->
<div class="mask_find_next">
下一步
</div>
</div>
</div>
<!--手机号设置-->
<div class="mask " style="display: none;">
<div class="mask_box m_top">
<!--标题-->
<div class="mask_tel">
手机号设置
</div>
<!--输入框盒子-->
<div class="mask_box_i">
<!--新手机号-->
<div class="mask_new">
<input class="mask_new_input" type="text" placeholder="新手机号">
</div>
<!--输入验证码-->
<div class="mask_new border_no">
<div class="mask_new">
<input class="mask_new_small" type="text" placeholder="输入验证码">
</div>
<div class="mask_new_text">获取验证码</div>
</div>
<!--底部按钮-->
<div class="mask_tel_button">
<!--左边取消-->
<div class="mask_tel_button_left">
取消
</div>
<!--右边保存-->
<div class="mask_tel_button_right">
保存
</div>
</div>
</div>
</div>
</div>
<!--安全验证-->
<div class="mask " style="display: none;">
<div class="mask_box m_top">
<!--标题-->
<div class="mask_tel">
安全认证
</div>
<!--输入框盒子-->
<div class="mask_box_i">
<!--使用手机号-->
<div class="mask_new">
<input class="mask_new_input" type="text" value="使用手机号134****2359">
</div>
<!--输入验证码-->
<div class="mask_new border_no">
<div class="mask_new">
<input class="mask_new_small" type="text" placeholder="输入验证码">
</div>
<div class="mask_new_text">获取验证码</div>
</div>
<!--底部按钮-->
<div class="mask_ver_button">
验证
</div>
</div>
</div>
</div>
<!--设置昵称-->
<div class="mask " style="display: none;">
<div class="mask_name">
<!--关闭按钮-->
<!--<div class="iconfont iconguanbi"></div>-->
<!--设置昵称-->
<div class="mask_name_title">
设置昵称
</div>
<!--昵称输入框-->
<div class="mask_name_input">
<input class="nickname" type="text" placeholder="请设置您的昵称" >
</div>
<!--提示文字-->
<div class="mask_name_hint">
不超过8个中文，不超过12个英文字母，不能有除了_-以外的字符
</div>
<!--提交完成按钮-->
<div class="mask_name_sub">
完成
</div>
</div>
</div>
<!--绑定手机号继续-->
<div class="mask " style="display: none;">
<div class="mask_name tel_height">
<!--关闭按钮-->
<!--<div class="iconfont iconguanbi"></div>-->
<!--设置昵称-->
<div class="mask_name_title">
绑定手机号继续
</div>
<!--头像-->
<div class="mask_tel_box">
<div class="mask_tel_box_pic">
<img src="images/1.png">
</div>
<p>你好啊小明同学</p>
</div>
<!--昵称输入框-->
<div class="mask_name_input">
<input class="nickname" type="text" placeholder="请设置您的昵称" >
</div>
<!--提示文字-->
<!--<div class="mask_name_hint">-->
<!--不超过8个中文，不超过12个英文字母，不能有除了_-以外的字符-->
<!--</div>-->
<!--提交完成按钮-->
<div class="mask_name_sub margin_to">
下一步
</div>
<!--跳过-->
<div class="mask_jump">
跳过这一步
</div>
</div>
</div>
<!--解绑账号-->
<div class="mask " style="display: none;">
<div class="mask_name">
<!--关闭按钮-->
<!--<div class="iconfont iconguanbi"></div>-->
<!--设置昵称-->
<div class="mask_name_title">
解绑账号
</div>
<!--设置其他登录方式-->
<div class="mask_name_way">
请设置其他登录方式后再解绑
</div>
<!--提交完成按钮-->
<div class="mask_name_sub way_top">
完成
</div>
</div>
</div>
<!--解绑账号2-->
<div class="mask " style="display: none;">
<div class="mask_name">
<!--关闭按钮-->
<!--<div class="iconfont iconguanbi"></div>-->
<!--设置昵称-->
<div class="mask_name_title">
解绑账号
</div>
<!--设置其他登录方式-->
<div class="mask_name_way">
请设置其他登录方式后再解绑
</div>
<!--提交完成按钮-->
<div class="mask_way_sub">
<div class="mask_way_sub_left">取消</div>
<div class="mask_way_sub_right">确定</div>
</div>
</div>
</div>
<!--设置新密码-->
<div class="mask " style="display: none;">
<div class="mask_box m_top">
<!--标题-->
<div class="mask_tel">
设置密码
</div>
<!--输入框盒子-->
<div class="mask_box_i">
<!--设置新密码-->
<div class="mask_new">
<input class="mask_new_input" type="text" placeholder="设置新密码">
</div>
<!--输入验证码-->
<div class="mask_new">
<input class="mask_new_input" type="text" placeholder="再次输入密码">
</div>
<!--底部按钮-->
<div class="mask_tel_button">
<!--左边取消-->
<div class="mask_tel_button_left">
取消
</div>
<!--右边保存-->
<div class="mask_tel_button_right">
确定
</div>
</div>
</div>
</div>
</div>
<!--设置邮箱-->
<div class="mask " style="display: none;">
<div class="mask_box m_top">
<!--标题-->
<div class="mask_tel">
设置邮箱
</div>
<!--输入框盒子-->
<div class="mask_box_i">
<!--新手机号-->
<div class="mask_new">
<input class="mask_new_input" type="text" placeholder="新增邮箱">
</div>
<!--输入验证码-->
<div class="mask_new border_no">
<div class="mask_new">
<input class="mask_new_small" type="text" placeholder="邮箱验证码">
</div>
<div class="mask_new_text">获取验证码</div>
</div>
<!--底部按钮-->
<div class="mask_tel_button">
<!--左边取消-->
<div class="mask_tel_button_left">
取消
</div>
<!--右边保存-->
<div class="mask_tel_button_right">
确定
</div>
</div>
</div>
</div>
</div>
<!--内容提交-->
<div class="mask" style="display: none;">
<div class="mask_box submit_height">
<div class="mask_submit_text">
<p>
内容已成功提交，我们将尽快审核。
</p>
<p>
（结果将通过站内信告知）
</p>
</div>
<div class="mask_submit_bottom">
确定
</div>
</div>
</div>
<!--隐私协议-->
<div class="mask" style="display: none;">
<div class="mask_box_a">
<!--大标题-->
<div class="mask_title">
隐私协议
</div>
<!--小标题-->
<div class="mask_small_text">
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
</div>
</div>
</div>
<!--关于我们-->
<div class="mask" style="display: flex;">
<div class="mask_box_a">
<!--大标题-->
<div class="mask_title">
关于我们
</div>
<!--小标题-->
<div class="mask_small_text">
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
一、我们可能收集的用户信息我们提供服务时，可能会收集、储存和使用下列与您有关
</div>
</div>
</div>
</div>
<div class="pop_fn">
</div>
</body>
<script src="js/jquery.min.js"></script>
<script>
function popup(message) {
$('.pop_fn').css('top', 3 + 'rem').html(message);
setTimeout(function() {
$('.pop_fn').css('top', '-' + 2 + 'rem').html(message);
}, 1800)
}
$(".mask_name_sub").click(function () {
var myreg = /^[\u4e00-\u9fa5]{1,8}|[a-zA-Z]{1,12}$/;
var newname = $(".nickname").val();
if (!myreg.test(newname)){
popup("请重新输入您的昵称")
}else {
popup("登录成功")
}
})
</script>
</html>
... ...
... ... @@ -2,8 +2,9 @@
<html lang="en">
<head>
<meta charset="UTF-8">
<title>首页</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>账号设置</title>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<!--<meta name="viewport" content="width=device-width, initial-scale=1" />-->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" type="text/css" href="css/common.css">
<link rel="stylesheet" type="text/css" href="css/zhsz.css">
... ... @@ -166,13 +167,55 @@
</div>
</div>
<!--下划线-->
<div class="bottom_item_box_mid"></div>
<!--<div class="bottom_item_box_mid"></div>-->
<!--文字-->
<div class="bottom_item_box_bottom">
取消绑定
</div>
</div>
<div class="bottom_item_box">
<!--图片-->
<div class="bottom_item_box_top">
<div class="bottom_item_box_top_p">
<img src="images/peke.png">
</div>
<div class="bottom_item_box_top_t">
微信
</div>
<!--<div class="bottom_item_box_top_t margin_t">-->
<!--已绑定"昵称"-->
<!--</div>-->
</div>
<!--下划线-->
<div class="bottom_item_box_mid"></div>
<!--文字-->
<div class="bottom_item_box_bottom">
立即绑定
</div>
</div>
<div class="bottom_item_box">
<!--图片-->
<div class="bottom_item_box_top">
<div class="bottom_item_box_top_p">
<img src="images/peke.png">
</div>
<div class="bottom_item_box_top_t">
微信
</div>
<!--<div class="bottom_item_box_top_t margin_t">-->
<!--已绑定"昵称"-->
<!--</div>-->
</div>
<!--下划线-->
<div class="bottom_item_box_mid"></div>
<!--文字-->
<div class="bottom_item_box_bottom">
立即绑定
</div>
</div>
</div>
</div>
... ...