Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
19e88277 by 任超
Options

style:办事指南

1 parent bd7d1b5f
Inline Side-by-side
Showing 5 changed files with 141 additions and 36 deletions
......@@ -11,8 +11,6 @@
color: #006CFF;
font-weight: 600;
}
/* ------------------------------end--------------------------------------- */
.navigation_crumbs {
width: 100%;
height: 45px;
......@@ -27,14 +25,16 @@
.one_content {
border: 1px solid #DEDEDE;;
margin-top: 20px!important;
margin-bottom: 60px!important;
}
.one_content .layui-tab {
margin: -1px;
}
.one_content .layui-tab-title li {
width: 150px;
font-weight: 600;
color: #6D7278;
line-height: 60px;
box-sizing: border-box;
}
.one_content .layui-tab-title .layui-this {
color: #4A4A4A;
......@@ -46,11 +46,18 @@
color: #006CFF;
}
.layui-tab .layui-tab-brief li {
width: 90px;
margin: 0 10px;
}
.online_business {
margin-top: 20px;
}
.online_business h2 .icon {
width: 17px;
height: 17px;
float: left;
margin-top: 12px;
margin-right: 7px;
}
.online_business h2 {
width: 100%;
height: 43px;
......@@ -73,7 +80,7 @@
border-bottom: 1px dotted #DEDEDE;
}
.online_list li:nth-child(even) {
margin-left: 10%;
margin-left: 7%;
}
.online_list li a{
display: block;
......@@ -86,3 +93,42 @@
float: right;
margin-top: 15px;
}
.busTabs {
background: #FAFAFA;
height: 60px!important;
line-height: 60px;
}
.busTabs li {
font-size: 20px!important;
font-weight: 400!important;
color: #6D7278!important;
}
.busTabs .layui-this {
border-top: 2px solid #006CFF;
background-color: #fff;
box-sizing: border-box;
width: 170px!important;
color: #4A4A4A!important;
font-weight: 600!important;
}
.busTabs .layui-this:after {
height: 60px!important;
}
.itemList_tab {
border-bottom: none!important;
margin-left: -10px;
margin-bottom: 30px;
}
.itemList_tab li {
box-sizing: border-box;
}
.layui-tab-brief>.layui-tab-title .layui-this{
color: #006CFF!important;
}
.layui-tab-brief>.layui-tab-title .layui-this::after {
border-bottom: 2px solid #006CFF!important;
margin-top: 5px;
width: 80%;
left: 10%;
}
\ No newline at end of file
......
......@@ -31,7 +31,7 @@
width: 100px;
height: 36px;
border-radius: 4px;
margin-right: 10px;
margin-right: 15px;
color: #fff;
text-align: center;
line-height: 36px;
......@@ -50,27 +50,29 @@
color: #006CFF!important;
border-color: #006CFF!important;
}
.business {
padding: 15px;
box-sizing: border-box;
overflow: hidden;
margin-top: 10px;
margin-left: -10px;
margin-right: -10px;
margin-top: 30px;
}
.online_processing , .online_examination{
width: 49%;
width: 50%;
background-color: #fff;
border-radius: 10px;
height: 300px;
box-sizing: border-box;
padding: 15px;
padding: 0 10px;
}
.list_title{
height: 36px;
line-height: 36px;
border-radius: 5px;
height: 48px;
border-radius: 4px;
line-height: 48px;
border: 1px solid #DEDEDE;
background: #FAFAFA;
}
.list_title h2 {
font-weight: 600;
margin-left: 10px;
color: #4A4A4A;
}
.online_processing {
float: left;
......@@ -78,9 +80,16 @@
.online_examination {
float: right;
}
.item_list {
padding: 20px;
box-sizing: border-box;
border-radius: 2px;
border: 1px solid #DEDEDE;
}
.item_list li{
margin: 25px 0;
cursor: pointer;
line-height: 50px;
border-bottom: 1px dotted #DEDEDE;
}
.item_list li p{
display: inline-block;
......@@ -98,7 +107,22 @@
color: #fff;
}
.type_title {
height: 16px;
padding-left: 8px;
font-size: 16px;
font-weight: 600;
margin-bottom: 10px;
margin-bottom: 15px;
position: relative;
padding-bottom: 10px;
color: #4A4A4A;
}
.type_title::before {
position:absolute;
content:"";
left:0;
width:4px;
height:12px;
border-radius: 1px;
top: 5px;
background-color: #0091FF;
}
\ No newline at end of file
......
......@@ -73,4 +73,4 @@ document.writeln("</body>");
document.writeln("");
document.writeln("</html>");
document.writeln("<script type='text/javascript' src=\'" + localhostPaht + "/staticLib/layui/layui.js\'></script>");
document.writeln("<script src=\'https://at.alicdn.com/t/font_2174584_uxkon9mpq1.js\'></script>");
\ No newline at end of file
document.writeln("<script src=\'https://at.alicdn.com/t/font_2174584_1j8kvwarwge.js\'></script>");
\ No newline at end of file
......
......@@ -23,14 +23,14 @@
<div class="one_content contentBox">
<div class="layui-tab">
<ul class="layui-tab-title">
<ul class="layui-tab-title busTabs">
<li class="layui-this">网上申请</li>
<li>在线预约</li>
</ul>
<div class="layui-tab-content">
<div class="layui-tab-item layui-show">
<div class="layui-tab layui-tab-brief" lay-filter="navtab">
<ul class="layui-tab-title">
<ul class="layui-tab-title itemList_tab">
<li class="layui-this" lay-id="0">全部</li>
<li lay-id="1">土地</li>
<li lay-id="2">房屋等建筑</li>
......@@ -39,7 +39,12 @@
</ul>
<div class="layui-tab-content tudi" style="padding:0">
<div class="online_business">
<h2>土地</h2>
<h2>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icontudi"></use>
</svg>
土地
</h2>
</div>
<ul class="online_list">
<li>
......@@ -103,7 +108,12 @@
<div class="layui-tab-content jianzhu" style="padding:0">
<div class="online_business">
<h2>房屋等建筑</h2>
<h2>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icontudi"></use>
</svg>
房屋等建筑
</h2>
</div>
<ul class="online_list">
<li>
......@@ -167,7 +177,12 @@
<div class="layui-tab-content linmu" style="padding:0">
<div class="online_business">
<h2>构筑物</h2>
<h2>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icontudi"></use>
</svg>
构筑物
</h2>
</div>
<ul class="online_list">
<li>
......@@ -231,7 +246,12 @@
<div class="layui-tab-content qita" style="padding:0">
<div class="online_business">
<h2>森马林木</h2>
<h2>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icontudi"></use>
</svg>
森马林木
</h2>
</div>
<ul class="online_list">
<li>
......@@ -305,7 +325,12 @@
</ul>
<div class="layui-tab-content tudi1" style="padding:0">
<div class="online_business navtab1">
<h2>土地</h2>
<h2>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icontudi"></use>
</svg>
土地
</h2>
</div>
<ul class="online_list">
<li>
......@@ -369,7 +394,12 @@
<div class="layui-tab-content jianzhu1" style="padding:0">
<div class="online_business navtab1">
<h2>房屋等建筑</h2>
<h2>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icontudi"></use>
</svg>
房屋等建筑
</h2>
</div>
<ul class="online_list">
<li>
......@@ -433,7 +463,12 @@
<div class="layui-tab-content linmu1" style="padding:0">
<div class="online_business navtab1">
<h2>构筑物</h2>
<h2>
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icontudi"></use>
</svg>
构筑物
</h2>
</div>
<ul class="online_list">
<li>
......
......@@ -56,13 +56,13 @@
</div>
</div>
<!-- ------------业务办理--------------- -->
<div class="business layui-bg-gray">
<div class="business">
<div class="online_processing">
<h1 class="type_title">即时办结</h1>
<div class="list_title layui-bg-gray">
<h1 class="type_title">在线办理即时业务(即时办结)</h1>
<ul class="item_list">
<div class="list_title">
<h2>预告类</h2>
</div>
<ul class="item_list">
<li>
<p>预售商品房抵押登记</p>
<div class="button">
......@@ -80,11 +80,11 @@
</ul>
</div>
<div class="online_examination">
<h1 class="type_title">网上预审</h1>
<div class="list_title layui-bg-gray">
<h1 class="type_title">网上预审(现场办结)</h1>
<ul class="item_list">
<div class="list_title">
<h2>预告类</h2>
</div>
<ul class="item_list">
<li>
<p>二手房买卖登记</p>
<div class="button">
......