Commit a2fcbf23 by Sweet Zhang

增加客服

parent 6feb56b8
<?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
<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"?>
<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>
</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/ci-campaign.iml" filepath="$PROJECT_DIR$/.idea/ci-campaign.iml" />
</modules>
</component>
</project>
\ No newline at end of file
*{padding: 0;margin: 0;color:#333;font-family: '微软雅黑';-webkit-box-sizing: border-box;
* {
padding: 0;
margin: 0;
color: #333;
font-family: '微软雅黑';
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
ul,ol{
box-sizing: border-box;
}
ul, ol {
list-style: none;
}
a{
color:#333;
a {
color: #333;
display: block;
text-decoration: none;
}
a:link{
text-decoration:none;
a:link {
text-decoration: none;
}
img{display:block;border:0;max-width: 100%;}
html,body{
width:100%;
height:100%;
img {
display: block;
border: 0;
max-width: 100%;
}
html, body {
width: 100%;
height: 100%;
min-width: 320px;
max-width: 640px;
margin:0 auto;
margin: 0 auto;
font-size: 16px;
}
.banner{
margin:0 auto;
.banner {
margin: 0 auto;
}
.btn1,.orderBtn,.testBtn{
.btn1, .orderBtn, .testBtn {
width: 70%;
margin: 0 auto;
}
.btn1{
margin:20px auto;
.btn1 {
margin: 20px auto;
}
.wrapper{
.wrapper {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.wrapper section{
.wrapper section {
float: left;
width: 100%;
padding: 0 5%;
}
.wrapper section label {
width: 30%;
float: left;
}
.form-control,.wrapper section .item{
.form-control, .wrapper section .item {
float: left;
width: 70%;
height: 34px;
line-height: 34px;
}
.wrapper section .item .icon{
.wrapper section .item .icon {
margin-right: 5%;
}
.item .sex_item{
.item .sex_item {
float: left;
width: 30%;
margin-right: 10%;
}
.wrapper section .tips{
.wrapper section .tips {
float: right;
width: 70%;
height: 30px;
line-height: 30px;
color:#f81e06;
color: #f81e06;
font-size: 12px;
}
.agree{
.agree {
font-size: 12px;
width: 100%;
height:25px;
line-height:25px;
height: 25px;
line-height: 25px;
position: relative;
}
.agree span{
.agree span {
display: inline-block;
position: absolute;
}
.agree span b{
font-weight:normal;
color:#8a8a8a;
.agree span b {
font-weight: normal;
color: #8a8a8a;
}
.content{
.content {
position: relative;
width: 100%;
margin:0 auto;
margin: 0 auto;
}
.content #orderBtn,.content #btn3{
.content #orderBtn, .content #btn3 {
position: absolute;
width: 70%;
left: 15%;
}
.content #orderBtn {
top: 66.5%;
}
.content #btn3 {
top: 83%;
}
footer{
footer {
width: 100%;
position: relative;
bottom:0;
bottom: 0;
background: #fff;
min-width: 320px;
max-width: 640px;
margin: 0 auto;
}
footer ul{
footer ul {
width: 100%;
border-top:1px #d1d1d1 solid;
border-top: 1px #d1d1d1 solid;
}
footer ul li{
footer ul li {
width: 50%;
float: left;
height:45px;
line-height:45px;
height: 45px;
line-height: 45px;
text-align: center;
border-right:1px #d1d1d1 solid;
border-right: 1px #d1d1d1 solid;
}
footer ul li:nth-child(2){
border-right:none;
footer ul li:nth-child(2) {
border-right: none;
}
footer ul li.selected{
footer ul li.selected {
background: #fc6351;
color: #fff;
}
/* .toast{
display: none;
width: 100%;
......@@ -157,31 +194,34 @@ footer ul li.selected{
height:80px;
line-height:80px;
}*/
.layui-m-layercont{
position: relative!important;
padding:0!important;
text-align: center!important;
width: 100%!important;
height: 105px!important;
line-height: 105px!important;
}
.totast_content{
.layui-m-layercont {
position: relative !important;
padding: 0 !important;
text-align: center !important;
width: 100% !important;
height: 105px !important;
line-height: 105px !important;
}
.totast_content {
width: 100%;
text-align: center;
margin: 0 auto;
height:130px;
height: 130px;
position: relative;
}
.totast_content .iconfont{
.totast_content .iconfont {
width: 60px;
height: 60px;
font-size: 60px;
position: relative;
top: 5px;
left: 40%;
line-height:60px;
line-height: 60px;
}
.callBtn{
.callBtn {
width: 60px;
text-align: center;
position: relative;
......@@ -189,13 +229,36 @@ footer ul li.selected{
top: 4%;
height: 40px;
line-height: 40px;
}
.layui-m-layercont .service_item{
}
.layui-m-layercont .service_item {
margin-top: 10%;
}
.layui-m-layercont p.service{
height:30px;
line-height:30px;
.layui-m-layercont p.service {
height: 30px;
line-height: 30px;
}
#compaignCS .csBox-init {
position: fixed;
top: 65%;
right: 1rem;
z-index: 1000;
width: 3.8rem;
height: 3.8rem;
transition: .2s;
background: url('https://p.qpic.cn/qidian_pic/2852152378/20190301581fc07351cb9ad81487d8362531b1f5/0') center/cover no-repeat;
}
#compaignCS .csBox-init-actived {
position: fixed;
top: 65%;
right: -1.9rem;
z-index: 1000;
width: 3.8rem;
height: 3.8rem;
transition: .2s;
background: url('https://p.qpic.cn/qidian_pic/2852152378/20190301581fc07351cb9ad81487d8362531b1f5/0') center/cover no-repeat;
}
\ No newline at end of file
......@@ -135,6 +135,11 @@ footer{
height:30px;
line-height:30px;
}
#compaignCS .csBox-init {
width: 0;
height: 0;
}
@media screen and (max-width: 1400px){
html,body{
font-size:12px;
......
......@@ -7,89 +7,93 @@
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/iconfont.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"/>
<link rel="stylesheet" href="css/mstyle.css">
<title>重疾险,大病保险-最惠比</title>
<meta name="keywords" content="重疾险,重疾险排名,重疾险哪家好" />
<meta name="description" content="2018畅销款重大疾病保险,保障范围100种重疾.30种轻症,保额50万。" />
<meta name="keywords" content="重疾险,重疾险排名,重疾险哪家好"/>
<meta name="description" content="2018畅销款重大疾病保险,保障范围100种重疾.30种轻症,保额50万。"/>
</head>
<body>
<div class="banner">
<img class="pbanner" src="images/banner.jpg" alt="banner" />
<section class="wrapper">
<img class="btn1" src="images/btn1.png" />
<section>
<label>性别:</label>
<div class="item">
<div class="sex_item"><span class="icon iconfont male on">&#xe684;</span></div>
<div class="sex_item"><span class="icon iconfont female">&#xe664;</span></div>
</div>
<div class="sexTips tips"></div>
</section>
<section>
<label>保障金额:</label>
<select class="form-control" id="choseMoney">
<option value="1">10万</option>
<option value="2">20万</option>
<option value="3">30万</option>
<option value="4">40万</option>
<option value="5">50万</option>
</select>
<div class="moneyTips tips"></div>
</section>
<section>
<label>姓名:</label>
<input class="form-control username" type="text" placeholder="请输入您的姓名">
<div class="nameTips tips"></div>
</section>
<section>
<label>手机号码:</label>
<input class="form-control userphone" type="text" placeholder="请输入您的手机号码">
<div class="phoneTips tips"></div>
</section>
<section>
<img class="testBtn" src="images/btn3.png" alt="保费试算">
</section>
<section class="last_item">
<div class="agree">
<span><i class="iconfont on">&#xe504;</i> <b>本人同意最惠比联系本人进行精准报价和产品介绍 </b></span>
</div>
<div class="agreeTips tips"></div>
</section>
</section>
<img class="bottom" src="images/bottom.png">
</div>
<section class="content">
<img class="bg" src="images/bg.jpg" />
<img id="orderBtn" src="images/btn2.png" alt="预约保险顾问">
<img id="btn3" src="images/btn2.png" alt="预约保险顾问">
</section>
<footer>
<ul class="tab">
<li id="askBtn">电话咨询</li>
<li class="jump">保费试算</li>
</ul>
</footer>
<!-- <div class="toast">
<div class="toast_wrapper">
<h2 class="title">400-921-9290</h2>
<div class="totast_content">
<span class="iconfont">&#xe6bb;</span>
<a class="callBtn" href="tel:+400-921-9290">拨打电话</a>
<div class="banner">
<img class="pbanner" src="images/banner.jpg" alt="banner"/>
<section class="wrapper">
<img class="btn1" src="images/btn1.png"/>
<section>
<label>性别:</label>
<div class="item">
<div class="sex_item"><span class="icon iconfont male on">&#xe684;</span></div>
<div class="sex_item"><span class="icon iconfont female">&#xe664;</span></div>
</div>
<div class="sexTips tips"></div>
</section>
<section>
<label>保障金额:</label>
<select class="form-control" id="choseMoney">
<option value="1">10万</option>
<option value="2">20万</option>
<option value="3">30万</option>
<option value="4">40万</option>
<option value="5">50万</option>
</select>
<div class="moneyTips tips"></div>
</section>
<section>
<label>姓名:</label>
<input class="form-control username" type="text" placeholder="请输入您的姓名">
<div class="nameTips tips"></div>
</section>
<section>
<label>手机号码:</label>
<input class="form-control userphone" type="text" placeholder="请输入您的手机号码">
<div class="phoneTips tips"></div>
</section>
<section>
<img class="testBtn" src="images/btn3.png" alt="保费试算">
</section>
<section class="last_item">
<div class="agree">
<span><i class="iconfont on">&#xe504;</i> <b>本人同意最惠比联系本人进行精准报价和产品介绍 </b></span>
</div>
<div class="agreeTips tips"></div>
</section>
</section>
<img class="bottom" src="images/bottom.png">
</div>
<section class="content">
<img class="bg" src="images/bg.jpg"/>
<img id="orderBtn" src="images/btn2.png" alt="预约保险顾问">
<img id="btn3" src="images/btn2.png" alt="预约保险顾问">
</section>
<footer>
<ul class="tab">
<li id="askBtn">电话咨询</li>
<li class="jump">保费试算</li>
</ul>
</footer>
<div id="compaignCS">
<div class="csBox-init"></div>
</div>
<!-- <div class="toast">
<div class="toast_wrapper">
<h2 class="title">400-921-9290</h2>
<div class="totast_content">
<span class="iconfont">&#xe6bb;</span>
<a class="callBtn" href="tel:+400-921-9290">拨打电话</a>
</div>
</div> -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/layer.js"></script>
<script src="js/base.js"></script>
<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>
</div>
</div> -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/layer.js"></script>
<script src="js/base.js"></script>
<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>
</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