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 @@ ...@@ -11,8 +11,6 @@
11 color: #006CFF; 11 color: #006CFF;
12 font-weight: 600; 12 font-weight: 600;
13 } 13 }
14 /* ------------------------------end--------------------------------------- */
15
16 .navigation_crumbs { 14 .navigation_crumbs {
17 width: 100%; 15 width: 100%;
18 height: 45px; 16 height: 45px;
...@@ -27,14 +25,16 @@ ...@@ -27,14 +25,16 @@
27 .one_content { 25 .one_content {
28 border: 1px solid #DEDEDE;; 26 border: 1px solid #DEDEDE;;
29 margin-top: 20px!important; 27 margin-top: 20px!important;
28 margin-bottom: 60px!important;
30 } 29 }
31 .one_content .layui-tab { 30 .one_content .layui-tab {
32 margin: -1px; 31 margin: -1px;
33 } 32 }
34 .one_content .layui-tab-title li { 33 .one_content .layui-tab-title li {
35 width: 150px;
36 font-weight: 600; 34 font-weight: 600;
37 color: #6D7278; 35 color: #6D7278;
36 line-height: 60px;
37 box-sizing: border-box;
38 } 38 }
39 .one_content .layui-tab-title .layui-this { 39 .one_content .layui-tab-title .layui-this {
40 color: #4A4A4A; 40 color: #4A4A4A;
...@@ -46,11 +46,18 @@ ...@@ -46,11 +46,18 @@
46 color: #006CFF; 46 color: #006CFF;
47 } 47 }
48 .layui-tab .layui-tab-brief li { 48 .layui-tab .layui-tab-brief li {
49 width: 90px; 49 margin: 0 10px;
50 } 50 }
51 .online_business { 51 .online_business {
52 margin-top: 20px; 52 margin-top: 20px;
53 } 53 }
54 .online_business h2 .icon {
55 width: 17px;
56 height: 17px;
57 float: left;
58 margin-top: 12px;
59 margin-right: 7px;
60 }
54 .online_business h2 { 61 .online_business h2 {
55 width: 100%; 62 width: 100%;
56 height: 43px; 63 height: 43px;
...@@ -73,7 +80,7 @@ ...@@ -73,7 +80,7 @@
73 border-bottom: 1px dotted #DEDEDE; 80 border-bottom: 1px dotted #DEDEDE;
74 } 81 }
75 .online_list li:nth-child(even) { 82 .online_list li:nth-child(even) {
76 margin-left: 10%; 83 margin-left: 7%;
77 } 84 }
78 .online_list li a{ 85 .online_list li a{
79 display: block; 86 display: block;
...@@ -86,3 +93,42 @@ ...@@ -86,3 +93,42 @@
86 float: right; 93 float: right;
87 margin-top: 15px; 94 margin-top: 15px;
88 } 95 }
96 .busTabs {
97 background: #FAFAFA;
98 height: 60px!important;
99 line-height: 60px;
100 }
101 .busTabs li {
102 font-size: 20px!important;
103 font-weight: 400!important;
104 color: #6D7278!important;
105 }
106 .busTabs .layui-this {
107 border-top: 2px solid #006CFF;
108 background-color: #fff;
109 box-sizing: border-box;
110 width: 170px!important;
111 color: #4A4A4A!important;
112 font-weight: 600!important;
113 }
114 .busTabs .layui-this:after {
115 height: 60px!important;
116 }
117 .itemList_tab {
118 border-bottom: none!important;
119 margin-left: -10px;
120 margin-bottom: 30px;
121 }
122 .itemList_tab li {
123 box-sizing: border-box;
124 }
125
126 .layui-tab-brief>.layui-tab-title .layui-this{
127 color: #006CFF!important;
128 }
129 .layui-tab-brief>.layui-tab-title .layui-this::after {
130 border-bottom: 2px solid #006CFF!important;
131 margin-top: 5px;
132 width: 80%;
133 left: 10%;
134 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -31,7 +31,7 @@ ...@@ -31,7 +31,7 @@
31 width: 100px; 31 width: 100px;
32 height: 36px; 32 height: 36px;
33 border-radius: 4px; 33 border-radius: 4px;
34 margin-right: 10px; 34 margin-right: 15px;
35 color: #fff; 35 color: #fff;
36 text-align: center; 36 text-align: center;
37 line-height: 36px; 37 line-height: 36px;
...@@ -50,27 +50,29 @@ ...@@ -50,27 +50,29 @@
50 color: #006CFF!important; 50 color: #006CFF!important;
51 border-color: #006CFF!important; 51 border-color: #006CFF!important;
52 } 52 }
53
53 .business { 54 .business {
54 padding: 15px; 55 margin-left: -10px;
55 box-sizing: border-box; 56 margin-right: -10px;
56 overflow: hidden; 57 margin-top: 30px;
57 margin-top: 10px;
58 } 58 }
59 .online_processing , .online_examination{ 59 .online_processing , .online_examination{
60 width: 49%; 60 width: 50%;
61 background-color: #fff; 61 background-color: #fff;
62 border-radius: 10px;
63 height: 300px;
64 box-sizing: border-box; 62 box-sizing: border-box;
65 padding: 15px; 63 padding: 0 10px;
66 } 64 }
67 .list_title{ 65 .list_title{
68 height: 36px; 66 height: 48px;
69 line-height: 36px; 67 border-radius: 4px;
70 border-radius: 5px; 68 line-height: 48px;
69 border: 1px solid #DEDEDE;
70 background: #FAFAFA;
71 } 71 }
72 .list_title h2 { 72 .list_title h2 {
73 font-weight: 600;
73 margin-left: 10px; 74 margin-left: 10px;
75 color: #4A4A4A;
74 } 76 }
75 .online_processing { 77 .online_processing {
76 float: left; 78 float: left;
...@@ -78,9 +80,16 @@ ...@@ -78,9 +80,16 @@
78 .online_examination { 80 .online_examination {
79 float: right; 81 float: right;
80 } 82 }
83 .item_list {
84 padding: 20px;
85 box-sizing: border-box;
86 border-radius: 2px;
87 border: 1px solid #DEDEDE;
88 }
81 .item_list li{ 89 .item_list li{
82 margin: 25px 0;
83 cursor: pointer; 90 cursor: pointer;
91 line-height: 50px;
92 border-bottom: 1px dotted #DEDEDE;
84 } 93 }
85 .item_list li p{ 94 .item_list li p{
86 display: inline-block; 95 display: inline-block;
...@@ -98,7 +107,22 @@ ...@@ -98,7 +107,22 @@
98 color: #fff; 107 color: #fff;
99 } 108 }
100 .type_title { 109 .type_title {
110 height: 16px;
111 padding-left: 8px;
101 font-size: 16px; 112 font-size: 16px;
102 font-weight: 600; 113 font-weight: 600;
103 margin-bottom: 10px; 114 margin-bottom: 15px;
115 position: relative;
116 padding-bottom: 10px;
117 color: #4A4A4A;
118 }
119 .type_title::before {
120 position:absolute;
121 content:"";
122 left:0;
123 width:4px;
124 height:12px;
125 border-radius: 1px;
126 top: 5px;
127 background-color: #0091FF;
104 } 128 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -73,4 +73,4 @@ document.writeln("</body>"); ...@@ -73,4 +73,4 @@ document.writeln("</body>");
73 document.writeln(""); 73 document.writeln("");
74 document.writeln("</html>"); 74 document.writeln("</html>");
75 document.writeln("<script type='text/javascript' src=\'" + localhostPaht + "/staticLib/layui/layui.js\'></script>"); 75 document.writeln("<script type='text/javascript' src=\'" + localhostPaht + "/staticLib/layui/layui.js\'></script>");
76 document.writeln("<script src=\'https://at.alicdn.com/t/font_2174584_uxkon9mpq1.js\'></script>");
...\ No newline at end of file ...\ No newline at end of file
76 document.writeln("<script src=\'https://at.alicdn.com/t/font_2174584_1j8kvwarwge.js\'></script>");
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -23,14 +23,14 @@ ...@@ -23,14 +23,14 @@
23 23
24 <div class="one_content contentBox"> 24 <div class="one_content contentBox">
25 <div class="layui-tab"> 25 <div class="layui-tab">
26 <ul class="layui-tab-title"> 26 <ul class="layui-tab-title busTabs">
27 <li class="layui-this">网上申请</li> 27 <li class="layui-this">网上申请</li>
28 <li>在线预约</li> 28 <li>在线预约</li>
29 </ul> 29 </ul>
30 <div class="layui-tab-content"> 30 <div class="layui-tab-content">
31 <div class="layui-tab-item layui-show"> 31 <div class="layui-tab-item layui-show">
32 <div class="layui-tab layui-tab-brief" lay-filter="navtab"> 32 <div class="layui-tab layui-tab-brief" lay-filter="navtab">
33 <ul class="layui-tab-title"> 33 <ul class="layui-tab-title itemList_tab">
34 <li class="layui-this" lay-id="0">全部</li> 34 <li class="layui-this" lay-id="0">全部</li>
35 <li lay-id="1">土地</li> 35 <li lay-id="1">土地</li>
36 <li lay-id="2">房屋等建筑</li> 36 <li lay-id="2">房屋等建筑</li>
...@@ -39,7 +39,12 @@ ...@@ -39,7 +39,12 @@
39 </ul> 39 </ul>
40 <div class="layui-tab-content tudi" style="padding:0"> 40 <div class="layui-tab-content tudi" style="padding:0">
41 <div class="online_business"> 41 <div class="online_business">
42 <h2>土地</h2> 42 <h2>
43 <svg class="icon svg-icon" aria-hidden="true">
44 <use xlink:href="#icontudi"></use>
45 </svg>
46 土地
47 </h2>
43 </div> 48 </div>
44 <ul class="online_list"> 49 <ul class="online_list">
45 <li> 50 <li>
...@@ -103,7 +108,12 @@ ...@@ -103,7 +108,12 @@
103 108
104 <div class="layui-tab-content jianzhu" style="padding:0"> 109 <div class="layui-tab-content jianzhu" style="padding:0">
105 <div class="online_business"> 110 <div class="online_business">
106 <h2>房屋等建筑</h2> 111 <h2>
112 <svg class="icon svg-icon" aria-hidden="true">
113 <use xlink:href="#icontudi"></use>
114 </svg>
115 房屋等建筑
116 </h2>
107 </div> 117 </div>
108 <ul class="online_list"> 118 <ul class="online_list">
109 <li> 119 <li>
...@@ -167,7 +177,12 @@ ...@@ -167,7 +177,12 @@
167 177
168 <div class="layui-tab-content linmu" style="padding:0"> 178 <div class="layui-tab-content linmu" style="padding:0">
169 <div class="online_business"> 179 <div class="online_business">
170 <h2>构筑物</h2> 180 <h2>
181 <svg class="icon svg-icon" aria-hidden="true">
182 <use xlink:href="#icontudi"></use>
183 </svg>
184 构筑物
185 </h2>
171 </div> 186 </div>
172 <ul class="online_list"> 187 <ul class="online_list">
173 <li> 188 <li>
...@@ -231,7 +246,12 @@ ...@@ -231,7 +246,12 @@
231 246
232 <div class="layui-tab-content qita" style="padding:0"> 247 <div class="layui-tab-content qita" style="padding:0">
233 <div class="online_business"> 248 <div class="online_business">
234 <h2>森马林木</h2> 249 <h2>
250 <svg class="icon svg-icon" aria-hidden="true">
251 <use xlink:href="#icontudi"></use>
252 </svg>
253 森马林木
254 </h2>
235 </div> 255 </div>
236 <ul class="online_list"> 256 <ul class="online_list">
237 <li> 257 <li>
...@@ -305,7 +325,12 @@ ...@@ -305,7 +325,12 @@
305 </ul> 325 </ul>
306 <div class="layui-tab-content tudi1" style="padding:0"> 326 <div class="layui-tab-content tudi1" style="padding:0">
307 <div class="online_business navtab1"> 327 <div class="online_business navtab1">
308 <h2>土地</h2> 328 <h2>
329 <svg class="icon svg-icon" aria-hidden="true">
330 <use xlink:href="#icontudi"></use>
331 </svg>
332 土地
333 </h2>
309 </div> 334 </div>
310 <ul class="online_list"> 335 <ul class="online_list">
311 <li> 336 <li>
...@@ -369,7 +394,12 @@ ...@@ -369,7 +394,12 @@
369 394
370 <div class="layui-tab-content jianzhu1" style="padding:0"> 395 <div class="layui-tab-content jianzhu1" style="padding:0">
371 <div class="online_business navtab1"> 396 <div class="online_business navtab1">
372 <h2>房屋等建筑</h2> 397 <h2>
398 <svg class="icon svg-icon" aria-hidden="true">
399 <use xlink:href="#icontudi"></use>
400 </svg>
401 房屋等建筑
402 </h2>
373 </div> 403 </div>
374 <ul class="online_list"> 404 <ul class="online_list">
375 <li> 405 <li>
...@@ -433,7 +463,12 @@ ...@@ -433,7 +463,12 @@
433 463
434 <div class="layui-tab-content linmu1" style="padding:0"> 464 <div class="layui-tab-content linmu1" style="padding:0">
435 <div class="online_business navtab1"> 465 <div class="online_business navtab1">
436 <h2>构筑物</h2> 466 <h2>
467 <svg class="icon svg-icon" aria-hidden="true">
468 <use xlink:href="#icontudi"></use>
469 </svg>
470 构筑物
471 </h2>
437 </div> 472 </div>
438 <ul class="online_list"> 473 <ul class="online_list">
439 <li> 474 <li>
......
...@@ -56,13 +56,13 @@ ...@@ -56,13 +56,13 @@
56 </div> 56 </div>
57 </div> 57 </div>
58 <!-- ------------业务办理--------------- --> 58 <!-- ------------业务办理--------------- -->
59 <div class="business layui-bg-gray"> 59 <div class="business">
60 <div class="online_processing"> 60 <div class="online_processing">
61 <h1 class="type_title">即时办结</h1> 61 <h1 class="type_title">在线办理即时业务(即时办结)</h1>
62 <div class="list_title layui-bg-gray"> 62 <ul class="item_list">
63 <div class="list_title">
63 <h2>预告类</h2> 64 <h2>预告类</h2>
64 </div> 65 </div>
65 <ul class="item_list">
66 <li> 66 <li>
67 <p>预售商品房抵押登记</p> 67 <p>预售商品房抵押登记</p>
68 <div class="button"> 68 <div class="button">
...@@ -80,11 +80,11 @@ ...@@ -80,11 +80,11 @@
80 </ul> 80 </ul>
81 </div> 81 </div>
82 <div class="online_examination"> 82 <div class="online_examination">
83 <h1 class="type_title">网上预审</h1> 83 <h1 class="type_title">网上预审(现场办结)</h1>
84 <div class="list_title layui-bg-gray"> 84 <ul class="item_list">
85 <div class="list_title">
85 <h2>预告类</h2> 86 <h2>预告类</h2>
86 </div> 87 </div>
87 <ul class="item_list">
88 <li> 88 <li>
89 <p>二手房买卖登记</p> 89 <p>二手房买卖登记</p>
90 <div class="button"> 90 <div class="button">
......