87a75001 by 任超

style:便民服务

1 parent ff206ebb
......@@ -138,40 +138,61 @@
</ul>
</div>
</div>
<div class="c_two">
<div class="subject">
<h2><a href="" title="便民服务">便民服务</a></h2>
<ul class="convenient_service">
<!-- 便民服务 -->
<div class="c_two convenient-service">
<h2 class="convenient-service-title">
<img src="/staticImages/bianminfuwu.png" />
<a href="/index.html" title="便民服务">便民服务</a>
</h2>
<ul class="convenient-service-list">
<li>
<a href="./staticViews/convenienceService/businessInquiry.html" title="业务查询">
<img src="./staticImages/ywcx.png" alt="业务查询" />
<img url="./staticImages/seywcx.png" src="./staticImages/ywcx.png" pre="./staticImages/ywcx.png" alt="业务查询" />
<h6>业务查询</h6>
<p>查询个人/企业相关不动产登记业务,包含目前正在办理的业务最新状态和已办结的业务详情信息等</p>
</a>
<p>办理进度、业务详情,在线查询</p>
<a href="./staticViews/convenienceService/businessInquiry.html" title="业务查询">立即查看</a>
</li>
<li>
<a id="appointment_inquiry" title="预约查询">
<img src="./staticImages/yycx.png" alt="预约查询" />
<img url="./staticImages/seyycx.png" src="./staticImages/yycx.png" pre="./staticImages/yycx.png" alt="预约查询" />
<h6>预约查询</h6>
<p>查询个人/企业线上约号业务,包含预约的业务名称、预约大厅详情、预约时间、预约流水号等信息</p>
</a>
<p>预约办理、号段预约,实时查询</p>
<a id="appointment_inquiry" title="预约查询">立即查看</a>
</li>
<li class="">
<a href="./staticViews/convenienceService/certificateVerification.html" title="证书查询">
<img src="./staticImages/zscx.png" alt="证书查询" />
<li>
<img url="./staticImages/sezscx.png" src="./staticImages/zscx.png" pre="./staticImages/zscx.png" alt="证书查询" />
<h6>证书查询</h6>
<p>根据所属区域及权利人相关信息查询相关证书信息,并提供电子证书在线预览、下载等功能</p>
</a>
<p>证书详情、证书核验,预览下载</p>
<a href="./staticViews/convenienceService/certificateVerification.html" title="证书查询">立即查看</a>
</li>
<li>
<a href="./staticViews/convenienceService/recordInquiry.html" title="合同备案查询">
<img src="./staticImages/htbacx.png" alt="合同备案查询" />
<img url="./staticImages/sehtbacx.png" src="./staticImages/htbacx.png" pre="./staticImages/htbacx.png" alt="合同备案查询" />
<h6>合同备案查询</h6>
<p>根据所属区域及权利人相关信息查询合同备案信息,并提供合同信息的详细信息展示</p>
</a>
<p>合同备案,在线预览、电子版下载</p>
<a href="./staticViews/convenienceService/recordInquiry.html" title="合同备案查询">立即查看</a>
</li>
</ul>
</div>
<!-- 好差评 -->
<div class="good-bad-comments-box">
<div class="good-bad-comments">
<div class="good-bad-nums">
<div class="good-bad-nums-title">
<img src="/staticImages/zan.png" />
好差评
</div>
<ul>
<li>评价数<span>599.9</span>万次</li>
<li>差评总数<span>30</span></li>
<li>差评整改率<span>98</span>%</li>
</ul>
</div>
<div class="login-list">
<p>不动产在线登记服务平台</p>
<a href="">个人登录</a>
<a href="">法人登录</a>
<a href="">个人注册</a>
<a href="">法人登录</a>
</div>
</div>
</div>
<!-- 法律法规 -->
<div class="laws_regulations">
......@@ -210,42 +231,6 @@
</div>
</div>
</div>
<!-- 好差评 -->
<div class="Good_bad_reviews">
<h3>好差评</h3>
<ul>
<li>
<p>
<b>787</b>
<span>万次</span>
</p>
<p>评价数</p>
</li>
<li>
<p>
<b>12</b>
<span></span>
</p>
<p>差评总数</p>
</li>
<li>
<p>
<b>100</b>
<span>%</span>
</p>
<p>差评修改率</p>
</li>
<li>
<p>
<b>92.6</b>
<span>%</span>
</p>
<p>差评数</p>
</li>
</ul>
</div>
<!-- 常见问题,政民互动 -->
<div class="common_question">
<div class="subject_con">
......
......@@ -45,6 +45,7 @@ div.top-logo {
background: #F7F9FB;
border: 1px solid #E2EAF1;
white-space: nowrap;
box-sizing: border-box;
}
::-webkit-input-placeholder {
......
......@@ -94,38 +94,6 @@
.laws_regulations .laws_list li:not(:last-child) {
border-bottom: 1px dashed #DEDEDE;
}
.convenient_service li a {
cursor: pointer;
}
/* ---------------好差评start---------------------------- */
.Good_bad_reviews {
width: 100%;
height: 180px;
background: url('../staticImages/bannerbg.png');
background-size: cover;
text-align: center;
color: #ffffff;
padding-top: 36px;
box-sizing: border-box;
}
.Good_bad_reviews h3 {
margin: 0 auto;
font-size: 26px;
margin-bottom: 5px;
}
.Good_bad_reviews ul {
width: 1200px;
margin: 0 auto;
}
.Good_bad_reviews li {
display: inline-block;
width: 24.6%;
}
.Good_bad_reviews li p b {
font-size: 40px;
}
/* ------------------end----------- */
/* -------------常见问题start--------------------- */
.common_question {
padding: 40px;
......@@ -310,52 +278,28 @@
text-align: left;
}
div.c_two {
background: #F6F9FB;
}
div.c_two div:first-child {
width: 1220px;
height: 425px;
padding-bottom: 20px;
}
div.c_two h2 {
float: left;
margin-top: 40px;
background-color: #fafafa;
width: 100%;
font-size: 26px;
font-weight: 600;
letter-spacing: 2px;
background-color: #fcf8f8;
}
div.c_two ul {
float: left;
margin-top: 28px;
list-style: none;
}
div.c_two ul li {
float: left;
width: 25%;
width: 285px;
height: 280px;
overflow: hidden;
}
div.c_two ul li a {
div.c_two ul li:not(:last-child) {
margin-right: 20px;
}
div.c_two ul li{
box-sizing: border-box;
display: block;
background: #ffffff;
padding: 50px 36px;
box-sizing: border-box;
border: 1px solid #E7ECEF;
margin: 0 10px;
background: #FFFFFF;
box-shadow: 0px 3px 6px 0px rgba(10, 14, 40, 0.06);
border-radius: 2px;
border: 1px solid #E9E9E9;
}
div.c_two ul li img {
width: 70px;
height: 70px;
width: 42px;
height: 42px;
}
div.c_two ul li:first-child {
......@@ -363,7 +307,7 @@ div.c_two ul li:first-child {
}
div.c_two ul li h6 {
margin-top: 20px;
margin-top: 23px;
font-size: 18px;
color: #4A4A4A;
letter-spacing: 2px;
......@@ -371,7 +315,7 @@ div.c_two ul li h6 {
div.c_two ul li p {
margin-top: 20px;
font-size: 14px;
font-size: 12px;
color: #9B9B9B;
line-height: 21px;
cursor: pointer;
......@@ -485,6 +429,7 @@ div.c_five ul li a img {
.news-module-box {
width: 1200px;
margin: 0 auto;
overflow: hidden;
}
.news-module-box .news-img{
float: left;
......@@ -593,3 +538,127 @@ div.c_five ul li a img {
color: #9B9B9B;
float: right;
}
/* 便民服务 */
.convenient-service .convenient-service-title {
margin: 40px 0;
}
.convenient-service .convenient-service-title img{
height: 32px;
position: relative;
top: 4px;
}
.convenient-service .convenient-service-title a{
color: #3C4A66;
font-size: 32px;
font-weight: 600;
}
.convenient-service-list {
width: 1200px;
margin: 0 auto;
overflow: hidden;
}
.convenient-service-list li:hover {
background-color: #5495FE;
}
.convenient-service-list li:hover h6 {
color: #FFFFFF;
}
.convenient-service-list li:hover p {
color: #FFFFFF!important;
}
.convenient-service-list li:hover a {
color: #FFFFFF;
border-color: #FFFFFF;
}
.convenient-service-list li a {
display: block;
width: 110px;
height: 36px;
border-radius: 2px;
border: 1px solid #D7D6D6;
margin: 0 auto;
text-align: center;
margin-top: 30px;
font-size: 14px;
color: #7A7A7A;
line-height: 36px;
}
/* 好差评 */
.good-bad-comments-box {
width: 100%;
background: url('/staticImages/good-badbg.png') no-repeat;
background-size: cover;
height: 200px;
margin-top: 40px;
padding: 36px 0;
box-sizing: border-box;
}
.good-bad-comments {
width: 1200px;
margin: 0 auto;
}
.good-bad-nums {
float: left;
margin-top: 15px;
}
.good-bad-nums .good-bad-nums-title {
color: #3C4A66;
font-size: 32px;
font-weight: 700;
}
.good-bad-nums .good-bad-nums-title img{
width: 31px;
height: 34px;
}
.good-bad-nums ul {
margin-top: 20px;
}
.good-bad-nums ul li {
display: inline-block;
color: #7A7A7A;
font-size: 16px;
margin-right: 30px;
}
.good-bad-nums ul li span {
font-size: 28px;
color: #608DE7;
margin: 0 6px;
}
.login-list {
float: right;
width: 464px;
height: 128px;
background: #FFFFFF;
border: 1px solid #E9E9E9;
box-sizing: border-box;
padding: 24px 54px;
text-align: center;
}
.login-list p {
color: #3C4A66;
letter-spacing: 2px;
font-size: 24px;
text-align: center;
margin-bottom: 20px;
}
.login-list a {
display: inline-block;
width: 80px;
height: 34px;
text-align: center;
font-size: 14px;
line-height: 32px;
box-sizing: border-box;
}
.login-list a:not(:last-child) {
margin-right: 5px;
}
.login-list a:nth-of-type(-n+2) {
color: #608DE7;
border: 1px solid #608DE7;
}
.login-list a:nth-of-type(n+3) {
border: 1px solid #E95515;
color: #E95515;
}
\ No newline at end of file
......

5.63 KB | W: | H:

1.49 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

4.67 KB | W: | H:

1.3 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

5.87 KB | W: | H:

1.41 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

6.78 KB | W: | H:

1.62 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
......@@ -63,6 +63,13 @@ function initData() {
$('.news-information-list').show();
}
})
// 便民服务
$(".convenient-service-list li").mouseover(function() {
$(this).find('img').attr('src', $(this).find('img').attr('url'))
})
$(".convenient-service-list li").mouseout(function() {
$(this).find('img').attr('src', $(this).find('img').attr('pre'))
})
}
// 获取汉字长度
function strLength(str) {
......