Commit f81a2db0 by Chao Sun

分享

parent b1dd8f05
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
...@@ -12,6 +13,7 @@ ...@@ -12,6 +13,7 @@
<!--Shortcut icon--> <!--Shortcut icon-->
<link rel="shortcut icon" href="https://www.ydinsurance.cn/wp-content/uploads/2018/04/favicon.gif" /> <link rel="shortcut icon" href="https://www.ydinsurance.cn/wp-content/uploads/2018/04/favicon.gif" />
</head> </head>
<body> <body>
<div> <div>
<img src="./images/bg.png"> <img src="./images/bg.png">
...@@ -20,7 +22,7 @@ ...@@ -20,7 +22,7 @@
<ul class="left"> <ul class="left">
<li class="kefu_Wrapper"> <li class="kefu_Wrapper">
<a href="http://q.url.cn/abkzV9?_type=wpa&qidian=true" target="_blank"> <a href="http://q.url.cn/abkzV9?_type=wpa&qidian=true" target="_blank">
<img class="icon" src="./images/icon.png" alt="icon" > <img class="icon" src="./images/icon.png" alt="icon">
<div class="kefu">客服</div> <div class="kefu">客服</div>
</a> </a>
</li> </li>
...@@ -98,11 +100,11 @@ ...@@ -98,11 +100,11 @@
<script src="./js/base.js"></script> <script src="./js/base.js"></script>
<script> <script>
var _hmt = _hmt || []; var _hmt = _hmt || [];
(function() { (function () {
const host = window.location.host; const host = window.location.host;
var hm = document.createElement("script"); var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27"; hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27";
if(host=='www.ydinsurance.cn'){ if (host == 'www.ydinsurance.cn') {
hm.src = "https://hm.baidu.com/hm.js?73a2215476525c6142927963135662e0"; hm.src = "https://hm.baidu.com/hm.js?73a2215476525c6142927963135662e0";
} }
var s = document.getElementsByTagName("script")[0]; var s = document.getElementsByTagName("script")[0];
...@@ -110,4 +112,5 @@ ...@@ -110,4 +112,5 @@
})(); })();
</script> </script>
</body> </body>
</html> </html>
\ No newline at end of file
*{margin:0;padding:0;} * {
html,body{ margin: 0;
width:100%; padding: 0;
height:auto; }
html, body {
width: 100%;
height: auto;
min-width: 320px; min-width: 320px;
max-width: 640px; max-width: 640px;
margin:0 auto; margin: 0 auto;
font-family: -apple-system, font-family: -apple-system,
BlinkMacSystemFont, BlinkMacSystemFont,
"Segoe UI", "Segoe UI",
...@@ -17,30 +21,35 @@ html,body{ ...@@ -17,30 +21,35 @@ html,body{
SimSun, SimSun,
sans-serif; sans-serif;
} }
a{
a {
text-decoration: none; text-decoration: none;
} }
img{
max-width:100%; img {
max-width: 100%;
display: block; display: block;
} }
ul,ol,li{
ul, ol, li {
list-style: none; list-style: none;
} }
input,button{
background:none; input, button {
outline:none; background: none;
border:0px; outline: none;
border: 0px;
} }
.footer{
.footer {
display: -webkit-flex; display: -webkit-flex;
display: flex; display: flex;
background: #fff; background: #fff;
position: relative; position: relative;
height:65px; height: 65px;
} }
.footer .left{ .footer .left {
-webkit-box-pack: start; -webkit-box-pack: start;
-ms-flex-pack: start; -ms-flex-pack: start;
justify-content: flex-start; justify-content: flex-start;
...@@ -56,7 +65,8 @@ input,button{ ...@@ -56,7 +65,8 @@ input,button{
padding: 0; padding: 0;
width: 66.66666667%; width: 66.66666667%;
} }
.footer .right{
.footer .right {
width: 33.33333333%; width: 33.33333333%;
display: -webkit-box; display: -webkit-box;
display: -ms-flexbox; display: -ms-flexbox;
...@@ -70,16 +80,18 @@ input,button{ ...@@ -70,16 +80,18 @@ input,button{
padding: 0; padding: 0;
color: #fff; color: #fff;
font-size: 22px; font-size: 22px;
background: linear-gradient(270deg,#f10000,#ff4e18); background: linear-gradient(270deg, #f10000, #ff4e18);
} }
.footer li{
.footer li {
color: #fe3400; color: #fe3400;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content:center; justify-content: center;
} }
.footer li.kefu_Wrapper{
.footer li.kefu_Wrapper {
position: relative; position: relative;
width: 80px; width: 80px;
height: 100%; height: 100%;
...@@ -100,7 +112,8 @@ input,button{ ...@@ -100,7 +112,8 @@ input,button{
align-items: center; align-items: center;
border-right: 1px #dcdcdc solid; border-right: 1px #dcdcdc solid;
} }
.footer li.share{
.footer li.share {
display: -webkit-box; display: -webkit-box;
display: -ms-flexbox; display: -ms-flexbox;
display: flex; display: flex;
...@@ -122,7 +135,8 @@ input,button{ ...@@ -122,7 +135,8 @@ input,button{
font-size: 13px; font-size: 13px;
} }
.footer li.peice_wrapper{
.footer li.peice_wrapper {
display: none; display: none;
display: -webkit-box; display: -webkit-box;
display: -ms-flexbox; display: -ms-flexbox;
...@@ -142,42 +156,49 @@ input,button{ ...@@ -142,42 +156,49 @@ input,button{
color: #ff3500; color: #ff3500;
margin-right: 0; margin-right: 0;
} }
.footer li.share img{
.footer li.share img {
max-width: 45%; max-width: 45%;
} }
.footer li .kefu{
.footer li .kefu {
font-size: 13px; font-size: 13px;
color: #fe3400; color: #fe3400;
text-align: center; text-align: center;
} }
.footer li .curPrice{
.footer li .curPrice {
font-size: 25px; font-size: 25px;
font-weight: bold; font-weight: bold;
} }
.curPrice span{
.curPrice span {
font-size: 20px; font-size: 20px;
} }
.price span{
.price span {
font-size: 10px; font-size: 10px;
} }
.price{
.price {
position: relative; position: relative;
font-size: 13px; font-size: 13px;
padding: 0 10px; padding: 0 10px;
} }
.price::before{
.price::before {
position: absolute; position: absolute;
top: 55%; top: 55%;
left:0; left: 0;
right: 0; right: 0;
margin:0 auto; margin: 0 auto;
content: ''; content: '';
width: 100%; width: 100%;
height: 1px; height: 1px;
background-color: #fe3400; background-color: #fe3400;
} }
.modalBox { .modalBox, .loginInBox {
position: fixed; position: fixed;
left: 0; left: 0;
top: 0; top: 0;
...@@ -193,55 +214,62 @@ input,button{ ...@@ -193,55 +214,62 @@ input,button{
max-width: 640px; max-width: 640px;
display: none; display: none;
} }
.inputBox {
.inputBox {
width: 90%; width: 90%;
margin: 0 auto; margin: 0 auto;
position: relative; position: relative;
top: 18%; top: 18%;
background: #fff; background: #fff;
padding: 10px; padding: 10px;
} }
.inputControl {
.inputControl {
width: 90%; width: 90%;
height: 42px; height: 42px;
border: 1px solid #ada598; border: 1px solid #ada598;
border-radius: 22px; border-radius: 22px;
font-size: 13px; font-size: 13px;
margin-bottom: 10%;
position: relative; position: relative;
display: flex; display: flex;
margin: 5% auto; margin: 5% auto 10%;
} }
.inputControl input{
.inputControl input {
font-size: 18px; font-size: 18px;
color: #757575; color: #757575;
margin-left: 5%; margin-left: 5%;
padding: 3px 0; padding: 3px 0;
} }
.inputControl input#phone{
width:58%; .inputControl input#phone {
} width: 58%;
.getPhoneNumber { }
.getPhoneNumber {
width: 100%; width: 100%;
height: 42px; height: 42px;
color: #000; color: #000;
border-radius: 22px; border-radius: 22px;
font-size: 14px; font-size: 14px;
} }
.autoGet {
.autoGet {
width: 40%; width: 40%;
height: 42px; height: 42px;
position: absolute; position: absolute;
right: 0px; right: 0px;
top: 0px; top: 0px;
} }
.commonBtn {
.commonBtn {
/* background: linear-gradient(270deg,#f10000,#ff4e18); */ /* background: linear-gradient(270deg,#f10000,#ff4e18); */
background: #ec2d37; background: #ec2d37;
color: #fff; color: #fff;
font-size: 18px; font-size: 18px;
} }
.goBuyBtn {
.goBuyBtn {
width: 60%; width: 60%;
height: 45px; height: 45px;
line-height: 45px; line-height: 45px;
...@@ -249,8 +277,9 @@ input,button{ ...@@ -249,8 +277,9 @@ input,button{
border: 2px solid #ff4e18a1; border: 2px solid #ff4e18a1;
margin: 5% 20%; margin: 5% 20%;
font-size: 18px; font-size: 18px;
} }
.closeModal {
.closeModal {
position: absolute; position: absolute;
right: 5px; right: 5px;
top: 5px; top: 5px;
...@@ -263,12 +292,13 @@ input,button{ ...@@ -263,12 +292,13 @@ input,button{
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
font-size: 22px; font-size: 22px;
} }
body .layui-m-layer .layui-m-layer-msg {
bottom: 0!important; body .layui-m-layer .layui-m-layer-msg {
} bottom: 0 !important;
}
.markbox { .markbox {
position: fixed; position: fixed;
left: 0; left: 0;
top: 0; top: 0;
...@@ -282,32 +312,35 @@ input,button{ ...@@ -282,32 +312,35 @@ input,button{
z-index: 100000; z-index: 100000;
background: rgba(0, 0, 0, 0.8); background: rgba(0, 0, 0, 0.8);
display: none; display: none;
} }
.iconfont { .iconfont {
position: absolute; position: absolute;
right: 8%; right: 8%;
font-size: 40px; font-size: 40px;
top: 2px; top: 2px;
font-weight: bold; font-weight: bold;
} }
.guideImgBox { .guideImgBox {
margin: 20px auto; margin: 20px auto;
} }
.guideImgBox img{
.guideImgBox img {
max-width: 15%; max-width: 15%;
position: relative; position: relative;
left: 80%; left: 80%;
} }
.tipsToast {
.tipsToast {
margin-top: 20%; margin-top: 20%;
} }
.tipsToast p {
.tipsToast p {
font-size: 18px; font-size: 18px;
margin-top: 10px; margin-top: 10px;
text-align: center; text-align: center;
letter-spacing: 1px; letter-spacing: 1px;
} }
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
...@@ -11,6 +12,7 @@ ...@@ -11,6 +12,7 @@
<link rel="stylesheet" href="./css/style.css" /> <link rel="stylesheet" href="./css/style.css" />
<link rel="shortcut icon" href="https://www.ydinsurance.cn/wp-content/uploads/2018/04/favicon.gif" /> <link rel="shortcut icon" href="https://www.ydinsurance.cn/wp-content/uploads/2018/04/favicon.gif" />
</head> </head>
<body> <body>
<div> <div>
<img src="./images/bg_toutiao.png"> <img src="./images/bg_toutiao.png">
...@@ -19,7 +21,7 @@ ...@@ -19,7 +21,7 @@
<ul class="left"> <ul class="left">
<li class="kefu_Wrapper"> <li class="kefu_Wrapper">
<a href="http://q.url.cn/abkzV9?_type=wpa&qidian=true" target="_blank"> <a href="http://q.url.cn/abkzV9?_type=wpa&qidian=true" target="_blank">
<img class="icon" src="./images/icon.png" alt="icon" > <img class="icon" src="./images/icon.png" alt="icon">
<div class="kefu">客服</div> <div class="kefu">客服</div>
</a> </a>
</li> </li>
...@@ -70,6 +72,26 @@ ...@@ -70,6 +72,26 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 登陆弹窗-->
<div class="loginInBox">
<div class='inputBox'>
<!--获取手机号 -->
<div class="mobileNoSection inputControl">
<input id="loginPhone" type='number' maxlength="11" placeholder="手机号" />
<div class='autoGet'>
<button class='getPhoneNumber commonBtn' id="loginCodeBtn">
获取验证码
</button>
</div>
</div>
<!--获取验证码 -->
<div class="codeSection inputControl">
<input id="loginCode" type='number' maxlength="4" placeholder="短信验证码" />
</div>
<!--登陆 -->
<button class='goBuyBtn commonBtn' id="loginIn">登陆</button>
</div>
</div>
<div id="d" hidden></div> <div id="d" hidden></div>
<script src="https://res2.wx.qq.com/open/js/jweixin-1.4.0.js "></script> <script src="https://res2.wx.qq.com/open/js/jweixin-1.4.0.js "></script>
<script src="./js/jquery.min.js"></script> <script src="./js/jquery.min.js"></script>
...@@ -77,11 +99,11 @@ ...@@ -77,11 +99,11 @@
<script src="./js/base.js"></script> <script src="./js/base.js"></script>
<script> <script>
var _hmt = _hmt || []; var _hmt = _hmt || [];
(function() { (function () {
const host = window.location.host; const host = window.location.host;
var hm = document.createElement("script"); var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27"; hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27";
if(host=='www.ydinsurance.cn'){ if (host == 'www.ydinsurance.cn') {
hm.src = "https://hm.baidu.com/hm.js?73a2215476525c6142927963135662e0"; hm.src = "https://hm.baidu.com/hm.js?73a2215476525c6142927963135662e0";
} }
var s = document.getElementsByTagName("script")[0]; var s = document.getElementsByTagName("script")[0];
...@@ -89,4 +111,5 @@ ...@@ -89,4 +111,5 @@
})(); })();
</script> </script>
</body> </body>
</html> </html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment