Commit b1dd8f05 by Sweet Zhang

增加分享码

parent b109bbab
*{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",
Roboto, Roboto,
"Helvetica Neue", "Helvetica Neue",
Helvetica, Helvetica,
"PingFang SC", "PingFang SC",
"Hiragino Sans GB", "Hiragino Sans GB",
"Microsoft YaHei", "Microsoft YaHei",
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;
...@@ -120,9 +133,10 @@ input,button{ ...@@ -120,9 +133,10 @@ input,button{
margin-right: 0; margin-right: 0;
border-right: 1px #dcdcdc solid; border-right: 1px #dcdcdc solid;
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{
max-width: 45%; .footer li.share img {
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{
font-size: 10px; .price span {
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,122 +214,133 @@ input,button{ ...@@ -193,122 +214,133 @@ input,button{
max-width: 640px; max-width: 640px;
display: none; display: none;
} }
.inputBox {
width: 90%; .inputBox {
margin: 0 auto; width: 90%;
position: relative; margin: 0 auto;
top: 18%; position: relative;
background: #fff; top: 18%;
padding: 10px; background: #fff;
} padding: 10px;
.inputControl { }
width: 90%;
height: 42px; .inputControl {
border: 1px solid #ada598; width: 90%;
border-radius: 22px; height: 42px;
font-size: 13px; border: 1px solid #ada598;
margin-bottom: 10%; border-radius: 22px;
position: relative; font-size: 13px;
display: flex; position: relative;
margin: 5% auto; display: flex;
} margin: 5% auto 10%;
.inputControl input{ }
font-size: 18px;
color: #757575; .inputControl input {
margin-left: 5%; font-size: 18px;
padding: 3px 0; color: #757575;
} margin-left: 5%;
.inputControl input#phone{ padding: 3px 0;
width:58%; }
}
.getPhoneNumber { .inputControl input#phone {
width: 100%; width: 58%;
height: 42px; }
color: #000;
border-radius: 22px; .getPhoneNumber {
font-size: 14px; width: 100%;
} height: 42px;
.autoGet { color: #000;
width: 40%; border-radius: 22px;
height: 42px; font-size: 14px;
position: absolute; }
right: 0px;
top: 0px; .autoGet {
} width: 40%;
.commonBtn { height: 42px;
/* background: linear-gradient(270deg,#f10000,#ff4e18); */ position: absolute;
background: #ec2d37; right: 0px;
color: #fff; top: 0px;
font-size: 18px; }
}
.goBuyBtn { .commonBtn {
width: 60%; /* background: linear-gradient(270deg,#f10000,#ff4e18); */
height: 45px; background: #ec2d37;
line-height: 45px; color: #fff;
border-radius: 22px; font-size: 18px;
border: 2px solid #ff4e18a1; }
margin: 5% 20%;
font-size: 18px; .goBuyBtn {
} width: 60%;
.closeModal { height: 45px;
position: absolute; line-height: 45px;
right: 5px; border-radius: 22px;
top: 5px; border: 2px solid #ff4e18a1;
color: #fff; margin: 5% 20%;
border: 2px solid #fff; font-size: 18px;
border-radius: 50%; }
width: 30px;
height: 30px; .closeModal {
line-height: 30px; position: absolute;
text-align: center; right: 5px;
cursor: pointer; top: 5px;
font-size: 22px; color: #fff;
} border: 2px solid #fff;
body .layui-m-layer .layui-m-layer-msg { border-radius: 50%;
bottom: 0!important; width: 30px;
} height: 30px;
line-height: 30px;
.markbox { text-align: center;
position: fixed; cursor: pointer;
left: 0; font-size: 22px;
top: 0; }
bottom: 0;
right: 0; body .layui-m-layer .layui-m-layer-msg {
width: 100%; bottom: 0 !important;
height: 100%; }
color: #fff;
display: flex; .markbox {
justify-content: flex-end; position: fixed;
z-index: 100000; left: 0;
background: rgba(0, 0, 0, 0.8); top: 0;
display: none; bottom: 0;
} right: 0;
width: 100%;
.iconfont { height: 100%;
position: absolute; color: #fff;
right: 8%; display: flex;
font-size: 40px; justify-content: flex-end;
top: 2px; z-index: 100000;
font-weight: bold; background: rgba(0, 0, 0, 0.8);
} display: none;
}
.guideImgBox {
margin: 20px auto; .iconfont {
} position: absolute;
.guideImgBox img{ right: 8%;
max-width: 15%; font-size: 40px;
position: relative; top: 2px;
left: 80%; font-weight: bold;
} }
.tipsToast {
margin-top: 20%; .guideImgBox {
} margin: 20px auto;
}
.tipsToast p {
font-size: 18px; .guideImgBox img {
margin-top: 10px; max-width: 15%;
text-align: center; position: relative;
letter-spacing: 1px; left: 80%;
} }
.tipsToast {
margin-top: 20%;
}
.tipsToast p {
font-size: 18px;
margin-top: 10px;
text-align: center;
letter-spacing: 1px;
}
...@@ -71,6 +71,26 @@ ...@@ -71,6 +71,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>
......
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
</profile>
</component>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JsFlowSettings">
<service-enabled>false</service-enabled>
<exe-path />
<annotation-enable>false</annotation-enable>
<other-services-enabled>false</other-services-enabled>
</component>
<component name="ProjectInspectionProfilesVisibleTreeState">
<entry key="Project Default">
<profile-state>
<expanded-state>
<State>
<id />
</State>
</expanded-state>
<selected-state>
<State>
<id>TypeScript</id>
</State>
</selected-state>
</profile-state>
</entry>
</component>
<component name="masterDetails">
<states>
<state key="ScopeChooserConfigurable.UI">
<settings>
<splitter-proportions>
<option name="proportions">
<list>
<option value="0.2" />
</list>
</option>
</splitter-proportions>
</settings>
</state>
</states>
</component>
</project>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/menggeClinic.iml" filepath="$PROJECT_DIR$/.idea/menggeClinic.iml" />
</modules>
</component>
</project>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Expires" content="0"/>
<meta name="viewport"
content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
<title>獴哥保险诊所</title>
<link rel="shortcut icon" href="favicon.ico"/>
<style>
body {
margin: 0;
padding: 0;
}
div {
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
div > img {
max-width: 100%;
height: auto;
}
</style>
</head>
<body>
<div>
<img src="mengge_marketing.jpg" alt="獴哥保险诊所" id="img">
</div>
<script>
var _hmt = _hmt || [];
(function () {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?36b1eb7eec3b5dac9f97d887092b5b27";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script>
window.onresize = function () {
device();
};
window.onload = function () {
device();
};
function device() {
if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
document.getElementById('img').src = 'mengge_marketing.jpg';
} else {
document.getElementById('img').src = 'mengge_marketing_pc.jpg';
}
}
</script>
</body>
</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