Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
2be82cdf by weimo934
Options

style():添加导航条

1 parent 92272d78
Inline Side-by-side
Showing 9 changed files with 298 additions and 779 deletions
...@@ -175,7 +175,7 @@ ...@@ -175,7 +175,7 @@
175 <script type="text/javascript" src="../../lib/layui/layui.js"></script> 175 <script type="text/javascript" src="../../lib/layui/layui.js"></script>
176 <script> 176 <script>
177 layui.use('element', function () { 177 layui.use('element', function () {
178 var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块 178 let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
179 //监听导航点击 179 //监听导航点击
180 element.on('nav(demo)', function (elem) { 180 element.on('nav(demo)', function (elem) {
181 //console.log(elem) 181 //console.log(elem)
......
...@@ -116,7 +116,87 @@ div.navigation { ...@@ -116,7 +116,87 @@ div.navigation {
116 116
117 117
118 /*------------------首页 end------------*/ 118 /*------------------首页 end------------*/
119 /* --------------------导航tab------------------------- */
120 .navigation_crumbs {
121 width: 100%;
122 height: 45px;
123 padding: 10px 0;
124 line-height: 25px;
125 background: #FAFAFA;
126 border: 1px solid #E6E6E6;
127 }
128 .navigation_crumbs .layui-breadcrumb a:hover {
129 color: #f46143!important;
130 }
119 131
132 .contentBox {
133 width: 1200px;
134 margin: 0 auto;
135 overflow: hidden;
136 }
137 .one_content {
138 border: 1px solid #DEDEDE;;
139 margin-top: 30px;
140 }
141 .one_content .layui-tab {
142 margin: 0;
143 }
144 .one_content .layui-tab-title li {
145 width: 100px;
146 font-weight: 600;
147 color: #6D7278;
148 }
149 .one_content .layui-tab-title .layui-this {
150 color: #4A4A4A;
151 }
152 .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {
153 border-color: #006CFF;
154 }
155 .layui-tab .layui-tab-brief .layui-this {
156 color: #006CFF;
157 }
158 .layui-tab .layui-tab-brief li {
159 width: 90px;
160 }
161 .online_business {
162 margin-top: 20px;
163 }
164 .online_business h2 {
165 width: 100%;
166 height: 43px;
167 line-height: 43px;
168 background: #FAFAFA;
169 border-radius: 4px;
170 border: 1px solid #DEDEDE;
171 padding-left: 15px;
172 box-sizing: border-box;
173 }
174 .online_list {
175 padding-bottom: 20px;
176 overflow: hidden;
177 }
178 .online_list li{
179 width: 45%!important;
180 float: left;
181 height: 60px;
182 line-height: 60px;
183 border-bottom: 1px dotted #DEDEDE;
184 }
185 .online_list li:nth-child(even) {
186 margin-left: 10%;
187 }
188 .online_list li a{
189 display: block;
190 width: 100%;
191 }
192 .online_list li a:hover span{
193 color: #f46143;
194 }
195 .online_list li a button {
196 float: right;
197 margin-top: 15px;
198 }
199 /* ---------------------------------------------------- */
120 .mainbody { 200 .mainbody {
121 width: 1200px; 201 width: 1200px;
122 margin: 0 auto; 202 margin: 0 auto;
...@@ -383,7 +463,7 @@ div.footer .system_service ul li a:hover { ...@@ -383,7 +463,7 @@ div.footer .system_service ul li a:hover {
383 } 463 }
384 464
385 .footer .subject { 465 .footer .subject {
386 width: 1200px; 466 width: 80%;
387 margin: 0 auto; 467 margin: 0 auto;
388 padding: 40px 0; 468 padding: 40px 0;
389 overflow: hidden; 469 overflow: hidden;
......
...@@ -34,8 +34,8 @@ ...@@ -34,8 +34,8 @@
34 </div> 34 </div>
35 <div class="navigation"> 35 <div class="navigation">
36 <ul class="layui-nav layui-bg-blue" lay-filter=""> 36 <ul class="layui-nav layui-bg-blue" lay-filter="">
37 <li class="layui-nav-item layui-this"><a href="">首页</a></li> 37 <li class="layui-nav-item "><a href="./../../index.html">首页</a></li>
38 <li class="layui-nav-item"><a href="">新闻动态</a></li> 38 <li class="layui-nav-item layui-this"><a href="">新闻动态</a></li>
39 <li class="layui-nav-item"><a href="">业务办理</a></li> 39 <li class="layui-nav-item"><a href="">业务办理</a></li>
40 <li class="layui-nav-item"><a href="">办事指南</a></li> 40 <li class="layui-nav-item"><a href="">办事指南</a></li>
41 <li class="layui-nav-item"> 41 <li class="layui-nav-item">
...@@ -51,6 +51,14 @@ ...@@ -51,6 +51,14 @@
51 <li class="layui-nav-item" class="item_last_child"><a href="">好差评</a></li> 51 <li class="layui-nav-item" class="item_last_child"><a href="">好差评</a></li>
52 </ul> 52 </ul>
53 </div> 53 </div>
54 <div class="navigation_crumbs">
55 <div class="contentBox">
56 <span class="layui-breadcrumb">
57 <a href="../../index.html">首页</a>
58 <a><cite>公示公告</cite></a>
59 </span>
60 </div>
61 </div>
54 <div class="mainbody"> 62 <div class="mainbody">
55 <div class="top"> 63 <div class="top">
56 <div class="top-title"> 64 <div class="top-title">
...@@ -240,6 +248,14 @@ ...@@ -240,6 +248,14 @@
240 <script type="text/javascript" src="../../js/main.min.js?t=1"></script> 248 <script type="text/javascript" src="../../js/main.min.js?t=1"></script>
241 <script type="text/javascript" src="../../lib/layui/layui.js"></script> 249 <script type="text/javascript" src="../../lib/layui/layui.js"></script>
242 <script type="text/javascript"> 250 <script type="text/javascript">
251 layui.use('element', function () {
252 let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
253 //监听导航点击
254 element.on('nav(demo)', function (elem) {
255 //console.log(elem)
256 layer.msg(elem.text());
257 });
258 });
243 $(function () { 259 $(function () {
244 $('.gg').click(function () { 260 $('.gg').click(function () {
245 window.location.href = "./../ggxq/index.html" 261 window.location.href = "./../ggxq/index.html"
......
...@@ -119,6 +119,88 @@ div.navigation { ...@@ -119,6 +119,88 @@ div.navigation {
119 } 119 }
120 120
121 /*------------------首页 end------------*/ 121 /*------------------首页 end------------*/
122
123 /* --------------------导航tab------------------------- */
124 .navigation_crumbs {
125 width: 100%;
126 height: 45px;
127 padding: 10px 0;
128 line-height: 25px;
129 background: #FAFAFA;
130 border: 1px solid #E6E6E6;
131 }
132 .navigation_crumbs .layui-breadcrumb a:hover {
133 color: #f46143!important;
134 }
135
136 .contentBox {
137 width: 1200px;
138 margin: 0 auto;
139 overflow: hidden;
140 }
141 .one_content {
142 border: 1px solid #DEDEDE;;
143 margin-top: 30px;
144 }
145 .one_content .layui-tab {
146 margin: 0;
147 }
148 .one_content .layui-tab-title li {
149 width: 100px;
150 font-weight: 600;
151 color: #6D7278;
152 }
153 .one_content .layui-tab-title .layui-this {
154 color: #4A4A4A;
155 }
156 .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {
157 border-color: #006CFF;
158 }
159 .layui-tab .layui-tab-brief .layui-this {
160 color: #006CFF;
161 }
162 .layui-tab .layui-tab-brief li {
163 width: 90px;
164 }
165 .online_business {
166 margin-top: 20px;
167 }
168 .online_business h2 {
169 width: 100%;
170 height: 43px;
171 line-height: 43px;
172 background: #FAFAFA;
173 border-radius: 4px;
174 border: 1px solid #DEDEDE;
175 padding-left: 15px;
176 box-sizing: border-box;
177 }
178 .online_list {
179 padding-bottom: 20px;
180 overflow: hidden;
181 }
182 .online_list li{
183 width: 45%!important;
184 float: left;
185 height: 60px;
186 line-height: 60px;
187 border-bottom: 1px dotted #DEDEDE;
188 }
189 .online_list li:nth-child(even) {
190 margin-left: 10%;
191 }
192 .online_list li a{
193 display: block;
194 width: 100%;
195 }
196 .online_list li a:hover span{
197 color: #f46143;
198 }
199 .online_list li a button {
200 float: right;
201 margin-top: 15px;
202 }
203 /* ---------------------------------------------------- */
122 .leftandright { 204 .leftandright {
123 width: 1200px; 205 width: 1200px;
124 margin: 0 auto; 206 margin: 0 auto;
......
...@@ -58,6 +58,14 @@ ...@@ -58,6 +58,14 @@
58 <li class="layui-nav-item" class="item_last_child"><a href="">好差评</a></li> 58 <li class="layui-nav-item" class="item_last_child"><a href="">好差评</a></li>
59 </ul> 59 </ul>
60 </div> 60 </div>
61 <div class="navigation_crumbs">
62 <div class="contentBox">
63 <span class="layui-breadcrumb">
64 <a href="../../index.html">首页</a>
65 <a><cite>新闻动态</cite></a>
66 </span>
67 </div>
68 </div>
61 <div class="leftandright"> 69 <div class="leftandright">
62 <div class="left"> 70 <div class="left">
63 <div class="xw"> 71 <div class="xw">
...@@ -259,6 +267,14 @@ ...@@ -259,6 +267,14 @@
259 <script type="text/javascript" src="../../js/main.min.js?t=1"></script> 267 <script type="text/javascript" src="../../js/main.min.js?t=1"></script>
260 <script type="text/javascript" src="../../lib/layui/layui.js"></script> 268 <script type="text/javascript" src="../../lib/layui/layui.js"></script>
261 <script type="text/javascript"> 269 <script type="text/javascript">
270 layui.use('element', function () {
271 let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
272 //监听导航点击
273 element.on('nav(demo)', function (elem) {
274 //console.log(elem)
275 layer.msg(elem.text());
276 });
277 });
262 layui.use('laypage', function () { 278 layui.use('laypage', function () {
263 $(function () { 279 $(function () {
264 $('.xw').click(function () { 280 $('.xw').click(function () {
......
...@@ -85,7 +85,87 @@ div.top-logo .top_logo_search i { ...@@ -85,7 +85,87 @@ div.top-logo .top_logo_search i {
85 } 85 }
86 86
87 /*------------------首页 end------------*/ 87 /*------------------首页 end------------*/
88 /* --------------------导航tab------------------------- */
89 .navigation_crumbs {
90 width: 100%;
91 height: 45px;
92 padding: 10px 0;
93 line-height: 25px;
94 background: #FAFAFA;
95 border: 1px solid #E6E6E6;
96 }
97 .navigation_crumbs .layui-breadcrumb a:hover {
98 color: #f46143!important;
99 }
88 100
101 .contentBox {
102 width: 1200px;
103 margin: 0 auto;
104 overflow: hidden;
105 }
106 .one_content {
107 border: 1px solid #DEDEDE;;
108 margin-top: 30px;
109 }
110 .one_content .layui-tab {
111 margin: 0;
112 }
113 .one_content .layui-tab-title li {
114 width: 100px;
115 font-weight: 600;
116 color: #6D7278;
117 }
118 .one_content .layui-tab-title .layui-this {
119 color: #4A4A4A;
120 }
121 .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {
122 border-color: #006CFF;
123 }
124 .layui-tab .layui-tab-brief .layui-this {
125 color: #006CFF;
126 }
127 .layui-tab .layui-tab-brief li {
128 width: 90px;
129 }
130 .online_business {
131 margin-top: 20px;
132 }
133 .online_business h2 {
134 width: 100%;
135 height: 43px;
136 line-height: 43px;
137 background: #FAFAFA;
138 border-radius: 4px;
139 border: 1px solid #DEDEDE;
140 padding-left: 15px;
141 box-sizing: border-box;
142 }
143 .online_list {
144 padding-bottom: 20px;
145 overflow: hidden;
146 }
147 .online_list li{
148 width: 45%!important;
149 float: left;
150 height: 60px;
151 line-height: 60px;
152 border-bottom: 1px dotted #DEDEDE;
153 }
154 .online_list li:nth-child(even) {
155 margin-left: 10%;
156 }
157 .online_list li a{
158 display: block;
159 width: 100%;
160 }
161 .online_list li a:hover span{
162 color: #f46143;
163 }
164 .online_list li a button {
165 float: right;
166 margin-top: 15px;
167 }
168 /* ---------------------------------------------------- */
89 .top-logo ul li { 169 .top-logo ul li {
90 display: inline-block; 170 display: inline-block;
91 padding: 0 8px; 171 padding: 0 8px;
......
...@@ -42,10 +42,10 @@ ...@@ -42,10 +42,10 @@
42 </div> 42 </div>
43 <div class="navigation"> 43 <div class="navigation">
44 <ul class="layui-nav layui-bg-blue" lay-filter=""> 44 <ul class="layui-nav layui-bg-blue" lay-filter="">
45 <li class="layui-nav-item layui-this"><a href="">首页</a></li> 45 <li class="layui-nav-item "><a href="./../../index.html">首页</a></li>
46 <li class="layui-nav-item"><a href="">新闻动态</a></li> 46 <li class="layui-nav-item layui-this" ><a href="./../xwdt/index.html">新闻动态</a></li>
47 <li class="layui-nav-item"><a href="">业务办理</a></li> 47 <li class="layui-nav-item"><a href="">业务办理</a></li>
48 <li class="layui-nav-item"><a href="">办事指南</a></li> 48 <li class="layui-nav-item"><a href="./../bszn/index.html">办事指南</a></li>
49 <li class="layui-nav-item"> 49 <li class="layui-nav-item">
50 <a href="javascript:;">查验中心</a> 50 <a href="javascript:;">查验中心</a>
51 <dl class="layui-nav-child"> 51 <dl class="layui-nav-child">
...@@ -59,6 +59,15 @@ ...@@ -59,6 +59,15 @@
59 <li class="layui-nav-item" class="item_last_child"><a href="">好差评</a></li> 59 <li class="layui-nav-item" class="item_last_child"><a href="">好差评</a></li>
60 </ul> 60 </ul>
61 </div> 61 </div>
62 <div class="navigation_crumbs">
63 <div class="contentBox">
64 <span class="layui-breadcrumb">
65 <a href="../../index.html">首页</a>
66 <a href="">新闻动态</a>
67 <a><cite>新闻详情</cite></a>
68 </span>
69 </div>
70 </div>
62 <div class="mainbody"> 71 <div class="mainbody">
63 <div class="left"> 72 <div class="left">
64 <div class="title"> 73 <div class="title">
...@@ -382,4 +391,12 @@ ...@@ -382,4 +391,12 @@
382 $('.left-left').removeClass('middle_active'); 391 $('.left-left').removeClass('middle_active');
383 } 392 }
384 }) 393 })
394 layui.use('element', function () {
395 var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
396 //监听导航点击
397 element.on('nav(demo)', function (elem) {
398 //console.log(elem)
399 layer.msg(elem.text());
400 });
401 });
385 </script> 402 </script>
......
1 * {
2 padding: 0;
3 margin: 0;
4 }
5
6 .main {
7 padding-left: 20px;
8 padding-right: 20px;
9 }
10
11 .mainbody {
12 width: 1200px;
13 margin: 0 auto;
14 }
15
16 /*================首页 start=====================*/
17 div a {
18 color: #000000;
19 text-decoration: none;
20 }
21
22 div.subject h2 a:hover {
23 color: #f46143;
24 }
25
26 div.subject {
27 margin: 0 auto;
28 float: none;
29 clear: both;
30 position: relative;
31 min-width: 1200px;
32 }
33
34 /*新闻 */
35 div.top-logo {
36 width: 1200px;
37 height: 70px;
38 padding-top: 20px;
39 }
40
41 div.top-logo ::-webkit-input-placeholder { /* WebKit browsers */
42 font-size: 13px;
43 }
44
45 div.top-logo ::-moz-placeholder { /* Mozilla Firefox 19+ */
46 font-size: 13px;
47 }
48
49 div.top-logo :-ms-input-placeholder { /* Internet Explorer 10+ */
50 font-size: 13px;
51 }
52
53 .top_logo_content {
54 height: 40px;
55 width: 100%;
56 margin: 0 auto;
57 }
58
59 div.top-logo .top_logo_search {
60 float: left;
61 width: 350px;
62 position: relative;
63 margin-left: 400px;
64 }
65
66 div.top-logo .top_logo_search input {
67 border-radius: 50px;
68 }
69
70 div.top-logo .login {
71 float: right;
72 margin-top: 8px;
73 }
74
75 div.top-logo .top_logo_search i {
76 position: absolute;
77 right: 10px;
78 top: 11px;
79 cursor: pointer;
80 }
81
82 /*end*/
83
84 .top-logo h1 {
85 display: inline-block;
86 float: left;
87 }
88
89 /*------------------首页 end------------*/
90
91 .top-logo ul li {
92 display: inline-block;
93 padding: 0 8px;
94 }
95
96 .top-logo ul li:first-child {
97 border-right: 1px solid grey;
98 }
99
100 div.navigation {
101 text-align: center;
102 }
103
104 .navigation .layui-nav-item {
105 width: 100px;
106 position: relative;
107 margin: 0 22px;
108 }
109
110 .layui-bg-blue {
111 background-color: #006CFF !important;
112 }
113
114 .layui-nav-item:not(:first-child)::before {
115 content: '';
116 position: absolute;
117 height: 22px;
118 border-left: 1px solid #ccc;
119 top: 21px;
120 left: -20px;
121 }
122
123
124 .top li {
125 font-size: 20px;
126 font-weight: 500;
127 color: #4A4A4A;
128 line-height: 60px;
129 }
130
131 .xsbl-sort {
132 display: flex;
133 justify-content: left;
134 padding-top: 20px;
135 padding-bottom: 20px;
136 }
137
138 .xsbl-sort > li {
139 display: inline-block;
140 font-size: 16px;
141 font-weight: 400;
142 color: #6D7278;
143 line-height: 16px;
144 margin-right: 10px;
145 }
146
147 .td {
148 height: auto;
149 }
150
151 .td-title {
152 height: auto;
153 font-size: 16px;
154 font-weight: 500;
155 color: #4A4A4A;
156 line-height: 40px;
157 background-color: #DEDEDE;
158 border: 1px solid #DEDEDE;
159 padding-left: 15px;
160 }
161
162 .layui-tab-title {
163 height: auto;
164 border-bottom-style: none;
165 }
166
167 .td-body {
168 display: flex;
169 flex-flow: row;
170 flex-wrap: wrap;
171 justify-content: space-between;
172
173 }
174
175 .td-item {
176 width: 48%;
177 height: auto;
178 background: #FFFFFF;
179 border-radius: 2px;
180 display: flex;
181 flex-flow: row nowrap;
182 justify-content: space-between;
183 border-bottom: 1px dashed #DEDEDE;
184 margin-right: 15px;
185 padding-top: 10px;
186 padding-bottom: 10px;
187 padding-left: 10px;
188 }
189
190 .td-item div {
191
192 }
193
194 .td-item button {
195 width: 90px;
196 height: 30px;
197 background: #2FA5FF;
198 border-radius: 4px;
199 border: none;
200 color: white;
201 line-height: 30px;
202 }
203
204 .fw {
205 height: auto;
206 }
207
208 .fw-title {
209 height: 40px;
210 font-size: 16px;
211 font-weight: 500;
212 color: #4A4A4A;
213 line-height: 40px;
214 background-color: #DEDEDE;
215 border: 1px solid #DEDEDE;
216 padding-left: 15px;
217 }
218
219 .fw-body {
220 display: flex;
221 flex-flow: row;
222 flex-wrap: wrap;
223 justify-content: space-between;
224
225 }
226
227 .fw-item {
228 width: 48%;
229 background: #FFFFFF;
230 border-radius: 2px;
231 display: flex;
232 flex-flow: row nowrap;
233 justify-content: space-between;
234 border-bottom: 1px dashed #DEDEDE;
235 margin-right: 15px;
236 padding-top: 10px;
237 padding-bottom: 10px;
238 padding-left: 10px;
239 }
240
241 .fw-item div {
242
243 }
244
245 .fw-item button {
246 width: 90px;
247 height: 30px;
248 background: #2FA5FF;
249 border-radius: 4px;
250 border: none;
251 color: white;
252 line-height: 30px;
253 }
254
255 .gzw {
256 height: auto;
257 }
258
259 .gzw-title {
260 height: 40px;
261 font-size: 16px;
262 font-weight: 500;
263 color: #4A4A4A;
264 line-height: 40px;
265 background-color: #DEDEDE;
266 border: 1px solid #DEDEDE;
267 padding-left: 15px;
268 }
269
270 .gzw-body {
271 display: flex;
272 flex-flow: row;
273 flex-wrap: wrap;
274 justify-content: space-between;
275
276 }
277
278 .gzw-item {
279 width: 48%;
280 height: auto;
281 background: #FFFFFF;
282 border-radius: 2px;
283 display: flex;
284 flex-flow: row nowrap;
285 justify-content: space-between;
286 border-bottom: 1px dashed #DEDEDE;
287 margin-right: 15px;
288 padding-top: 10px;
289 padding-bottom: 10px;
290 padding-left: 10px;
291 }
292
293 .gzw-item div {
294
295 }
296
297 .gzw-item button {
298 width: 90px;
299 height: 30px;
300 background: #2FA5FF;
301 border-radius: 4px;
302 border: none;
303 color: white;
304 line-height: 30px;
305 }
306
307 .sl {
308 height: auto;
309 }
310
311 .sl-title {
312 height: 40px;
313 font-size: 16px;
314 font-weight: 500;
315 color: #4A4A4A;
316 line-height: 40px;
317 background-color: #DEDEDE;
318 border: 1px solid #DEDEDE;
319 padding-left: 15px;
320 }
321
322 .sl-body {
323 display: flex;
324 flex-flow: row;
325 flex-wrap: wrap;
326 justify-content: space-between;
327
328 }
329
330 .sl-item {
331 width: 48%;
332 height: auto;
333 background: #FFFFFF;
334 border-radius: 2px;
335 display: flex;
336 flex-flow: row nowrap;
337 justify-content: space-between;
338 border-bottom: 1px dashed #DEDEDE;
339 margin-right: 15px;
340 padding-top: 10px;
341 padding-bottom: 10px;
342 padding-left: 10px;
343 }
344
345 .sl-item div {
346
347 }
348
349 .sl-item button {
350 width: 90px;
351 height: 30px;
352 background: #2FA5FF;
353 border-radius: 4px;
354 border: none;
355 color: white;
356 line-height: 30px;
357 }
358
359 /* -----------------底部start----------------------------- */
360 div.footer {
361 background-color: #233042;
362 }
363
364 div.footer .system_service {
365 width: 100%;
366 border-bottom: 1px solid #4A4A4A;
367 }
368
369 div.footer .system_service ul {
370 padding: 40px 0;
371 width: 1400px;
372 margin: 0 auto;
373 font-size: 0;
374 }
375
376 div.footer .system_service ul li {
377 width: 20%;
378 display: inline-block;
379 text-align: center;
380 height: 18px;
381 box-sizing: border-box;
382 }
383
384 div.footer .system_service ul li:not(:last-child) {
385 border-right: 1px solid #6D7278;
386 }
387
388 div.footer .system_service ul li a {
389 font-size: 16px;
390 font-weight: 400;
391 color: #DEDEDE;
392 }
393
394 div.footer .system_service ul li a:hover {
395 color: #f46143;
396 }
397
398 .footer .subject {
399 width: 1200px;
400 margin: 0 auto;
401 padding: 40px 0;
402 overflow: hidden;
403 }
404
405 .footer .subject .footer_logo {
406 float: left;
407 }
408
409 .footer .subject .footer_logo a {
410 display: block;
411 width: 64px;
412 height: 74px;
413 padding: 10px;
414 }
415
416 .footer .subject .footer_logo a img {
417 width: 100%;
418 height: 100%;
419 }
420
421 .footer .subject ul, ol {
422 float: left;
423 color: #CBCBCB;
424 text-align: left;
425 }
426
427 .footer .subject ul {
428 width: 73%;
429 box-sizing: border-box;
430 padding-left: 40px;
431 margin-top: 10px;
432 }
433
434 .footer .subject ul li {
435 width: 30%;
436 display: inline-block;
437 text-align: left;
438 margin-bottom: 30px;
439 }
440
441 .footer .subject ol li {
442 display: inline-block;
443 text-align: center;
444 }
445
446 .footer .subject ol li:last-child {
447 margin-left: 60px;
448 }
449
450 .footer .subject ol li img {
451 width: 80px;
452 height: 80px;
453 }
454
455 .footer .subject ol li p {
456 font-size: 12px;
457 color: #CBCBCB;
458 margin-top: 5px;
459 }
...\ No newline at end of file ...\ No newline at end of file
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>业务指南</title>
6 <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
7 <meta name="format-detection" content="telephone=no">
8 <meta name="renderer" content="webkit">
9 <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
10 <meta http-equiv="Cache-Control" content="no-siteapp"/>
11 <link rel="stylesheet" type="text/css" href="../../lib/layui/css/layui.css"/>
12 <link rel="alternate icon" type="image/png" href="../../images/logo-realestate.png">
13 <link rel='icon' href='../../favicon.ico' type='image/x-ico'/>
14 <meta name="description" content=""/>
15 <meta name="keywords" content=""/>
16 <link rel="stylesheet" href="../../css/default.min.css?t=227"/>
17 <link rel="stylesheet" type="text/css" href="css/index.css">
18 </head>
19 <body>
20 <div class="main">
21
22 <div class="subject top-logo">
23 <div class="top_logo_content">
24 <h1><a href="index.html"><img src="./../../images/logo.jpg" alt="西安市不动产登记平台"/></a></h1>
25
26 <div class="top_logo_search">
27 <input type="text" name="title" required lay-verify="required" placeholder="请输入关键字搜索" autocomplete="off"
28 class="layui-input">
29 <i class="layui-icon layui-icon-search" style="font-size: 14px;"></i>
30 </div>
31
32 <ul class="login">
33 <li>登录</li>
34 <li>注册</li>
35 </ul>
36 </div>
37 </div>
38 <div class="navigation">
39 <ul class="layui-nav layui-bg-blue" lay-filter="">
40 <li class="layui-nav-item layui-this"><a href="">首页</a></li>
41 <li class="layui-nav-item"><a href="">新闻动态</a></li>
42 <li class="layui-nav-item"><a href="">业务办理</a></li>
43 <li class="layui-nav-item"><a href="">办事指南</a></li>
44 <li class="layui-nav-item">
45 <a href="javascript:;">查验中心</a>
46 <dl class="layui-nav-child">
47 <!-- 二级菜单 -->
48 <dd><a href="">移动模块</a></dd>
49 <dd><a href="">后台模版</a></dd>
50 <dd><a href="">电商平台</a></dd>
51 </dl>
52 </li>
53 <li class="layui-nav-item"><a href="">在线缴费</a></li>
54 <li class="layui-nav-item" class="item_last_child"><a href="">好差评</a></li>
55 </ul>
56 </div>
57 <div class="mainbody">
58 <div class="layui-tab layui-tab-card">
59 <ul class="layui-tab-title top">
60 <li class="layui-this">线上办理</li>
61 <li>线下办理</li>
62 </ul>
63 <div class="layui-tab-content">
64 <div class="layui-tab-item layui-show ">
65 <div class="xsbl-sort">
66 <li>全部</li>
67 <li>土地</li>
68 <li>房屋建筑物</li>
69 <li>构筑物</li>
70 <li>森林、林木</li>
71 <li>其他</li>
72 </div>
73 <div class="td">
74 <div class="td-title">
75 土地
76 </div>
77 <div class="td-body">
78 <div class="td-item">
79 <div>
80 <span>
81 土地-企业-转移登记（买卖）
82 </span>
83 </div>
84 <div>
85 <button>在线办理</button>
86 </div>
87 </div>
88 <div class="td-item">
89 <div>
90 <span>
91 土地-企业-转移登记（买卖）
92 </span>
93 </div>
94 <div>
95 <button>在线办理</button>
96 </div>
97 </div>
98 <div class="td-item">
99 <div>
100 <span>
101 土地-企业-转移登记（买卖）
102 </span>
103 </div>
104 <div>
105 <button>在线办理</button>
106 </div>
107 </div>
108 </div>
109 </div>
110 <div class="fw">
111 <div class="fw-title">
112 土地
113 </div>
114 <div class="fw-body">
115 <div class="fw-item">
116 <div>
117 <span>
118 土地-企业-转移登记（买卖）
119 </span>
120 </div>
121 <div>
122 <button>在线办理</button>
123 </div>
124 </div>
125 <div class="fw-item">
126 <div>
127 <span>
128 土地-企业-转移登记（买卖）
129 </span>
130 </div>
131 <div>
132 <button>在线办理</button>
133 </div>
134 </div>
135 <div class="fw-item">
136 <div>
137 <span>
138 土地-企业-转移登记（买卖）
139 </span>
140 </div>
141 <div>
142 <button>在线办理</button>
143 </div>
144 </div>
145 </div>
146 </div>
147 <div class="gzw">
148 <div class="gzw-title">
149 土地
150 </div>
151 <div class="gzw-body">
152 <div class="gzw-item">
153 <div>
154 <span>
155 土地-企业-转移登记（买卖）
156 </span>
157 </div>
158 <div>
159 <button>在线办理</button>
160 </div>
161 </div>
162 <div class="gzw-item">
163 <div>
164 <span>
165 土地-企业-转移登记（买卖）
166 </span>
167 </div>
168 <div>
169 <button>在线办理</button>
170 </div>
171 </div>
172 <div class="gzw-item">
173 <div>
174 <span>
175 土地-企业-转移登记（买卖）
176 </span>
177 </div>
178 <div>
179 <button>在线办理</button>
180 </div>
181 </div>
182 </div>
183 </div>
184 <div class="sl">
185 <div class="sl-title">
186 土地
187 </div>
188 <div class="sl-body">
189 <div class="sl-item">
190 <div>
191 <span>
192 土地-企业-转移登记（买卖）
193 </span>
194 </div>
195 <div>
196 <button>在线办理</button>
197 </div>
198 </div>
199 <div class="sl-item">
200 <div>
201 <span>
202 土地-企业-转移登记（买卖）
203 </span>
204 </div>
205 <div>
206 <button>在线办理</button>
207 </div>
208 </div>
209 <div class="sl-item">
210 <div>
211 <span>
212 土地-企业-转移登记（买卖）
213 </span>
214 </div>
215 <div>
216 <button>在线办理</button>
217 </div>
218 </div>
219 </div>
220 </div>
221 </div>
222 <div class="layui-tab-item">内容2</div>
223 </div>
224 </div>
225 </div>
226
227 <div class="footer">
228 <div class="system_service">
229 <ul class="">
230 <li>
231 <a href="">
232 <span>公示公告</span>
233 </a>
234 </li>
235 <li>
236 <a href="">
237 <span>法律法规</span>
238 </a>
239 </li>
240 <li>
241 <a href="">
242 <span>相应政策</span>
243 </a>
244 </li>
245 <li>
246 <a href="">
247 <span>下载服务</span>
248 </a>
249 </li>
250 <li>
251 <a href="">
252 <span>关于我们</span>
253 </a>
254 </li>
255 </ul>
256 </div>
257 <div class="subject">
258 <div class="footer_logo">
259 <a href="">
260 <img src="./../../images/jiguan.png">
261 </a>
262 </div>
263 <ul>
264 <li>
265 西安市自然资源和规划局
266 </li>
267 <li>
268 电话：028-456465
269 </li>
270 <li>
271 地址：西安市丰城8路
272 </li>
273 <li>
274 网站标识吗：87987987
275 </li>
276 <li>
277 备案：陕IPC456465465
278 </li>
279 <li>
280 陕公网备案：456465465
281 </li>
282 </ul>
283 <ol>
284 <li>
285 <img src="./../../images/code.png">
286 <p>扫描关注公众号</p>
287 </li>
288 <li>
289 <img src="./../../images/code.png">
290 <p>扫描关注公众号</p>
291 </li>
292
293 </ol>
294 </div>
295 </div>
296 </div>
297 </body>
298 </html>
299 <!--[if (gte IE 9)|!(IE)]><!-->
300 <script type="text/javascript" src="../../lib/jquery/jquery.min.js"></script>
301 <!--<![endif]-->
302 <script type="text/javascript" src="../../lib/handlebars/handlebars.min.js"></script>
303 <script type="text/javascript" src="../../lib/iscroll/iscroll-probe.js"></script>
304 <script type="text/javascript" src="../../lib/amazeui/amazeui.min.js"></script>
305 <script type="text/javascript" src="../../lib/raty/jquery.raty.js"></script>
306 <script type="text/javascript" src="../../js/main.min.js?t=1"></script>
307 <script type="text/javascript" src="../../lib/layui/layui.js"></script>
308 <script>
309 layui.use('element', function () {
310 let $ = layui.jquery
311 , element = layui.element; //Tab的切换功能，切换事件监听等，需要依赖element模块
312 });
313 </script>
...\ No newline at end of file ...\ No newline at end of file