Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
d6cc3ed8 by 任超
Options

feat:首页

1 parent f1253678
Inline Side-by-side
Showing 7 changed files with 556 additions and 76 deletions
...@@ -8,6 +8,9 @@ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockq ...@@ -8,6 +8,9 @@ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockq
8 background: transparent; 8 background: transparent;
9 font-family: Arial; 9 font-family: Arial;
10 } 10 }
11 .clearfix {
12 overflow: auto;
13 }
11 14
12 15
13 /*================首页 start=====================*/ 16 /*================首页 start=====================*/
...@@ -183,7 +186,8 @@ div.banner ul li a { ...@@ -183,7 +186,8 @@ div.banner ul li a {
183 .laws_regulations { 186 .laws_regulations {
184 width: 1200px; 187 width: 1200px;
185 margin: 0 auto; 188 margin: 0 auto;
186 padding: 60px 0; 189 padding: 50px 0;
190 overflow: hidden;
187 } 191 }
188 .laws_regulations .regulations, .policy { 192 .laws_regulations .regulations, .policy {
189 border-radius: 2px; 193 border-radius: 2px;
...@@ -198,28 +202,191 @@ div.banner ul li a { ...@@ -198,28 +202,191 @@ div.banner ul li a {
198 202
199 .laws_regulations .regulations{ 203 .laws_regulations .regulations{
200 float: left; 204 float: left;
201 padding-left: 5px;
202 } 205 }
203 .laws_regulations .regulations h2 a{ 206 .laws_regulations .title h2 a{
204 display: block; 207 display: block;
205 padding: 20px; 208 padding: 20px;
206 box-sizing: border-box; 209 box-sizing: border-box;
210 height: 60px;
211 box-sizing: border-box;
207 border-bottom: 1px solid #E6E6E6; 212 border-bottom: 1px solid #E6E6E6;
213 width: 100%;
208 } 214 }
209 .laws_regulations .regulations h2 a p{ 215 .laws_regulations .title h2 a p{
210 font-weight: 600; 216 font-weight: 600;
211 color: #4A4A4A; 217 color: #4A4A4A;
212 line-height: 20px; 218 float: left;
219 height: 36px;
220 border-bottom: 2px solid #006CFF;
213 } 221 }
214 .laws_regulations .regulations h2 i{ 222 .laws_regulations .title h2 a p span {
223 position: relative;
224 }
225
226 .laws_regulations .title h2 i{
215 font-style: normal; 227 font-style: normal;
216 float: right; 228 float: right;
217 font-size: 14px; 229 font-size: 14px;
218 color: #9B9B9B; 230 color: #9B9B9B;
219 line-height: 14px;
220 } 231 }
221 232 .laws_regulations .title h2 i:hover {
233 color: #f46143;
234 }
235 .laws_regulations .laws_list {
236 padding: 0 21px;
237 }
238 .laws_regulations .laws_list li{
239 height: 50px;
240 line-height: 50px;
241 padding-left: 3px;
242 }
243 .laws_regulations .laws_list li a{
244 display: block;
245 white-space:nowrap; /*文本不换行*/
246 text-overflow:ellipsis;/*设置超出部分显示...*/
247 -o-text-overflow:ellipsis;
248 overflow: hidden;
249 width: 380px;
250 }
251 .laws_regulations .laws_list li a:hover {
252 color: #f46143;;
253 }
254 .laws_regulations .laws_list li:not(:last-child) {
255 border-bottom: 1px dotted #DEDEDE;
256 }
222 /* ---------------end----------------------- */ 257 /* ---------------end----------------------- */
258
259 /* ---------------好差评start---------------------------- */
260 .Good_bad_reviews {
261 width: 100%;
262 height: 180px;
263 }
264 .Good_bad_reviews img {
265 width: 100%;
266 height: 100%;
267 }
268
269 /* ------------------end----------- */
270 /* -------------常见问题start--------------------- */
271 .common_question {
272 padding: 40px;
273 background-color: #F6F9FB;
274 }
275 .common_question .subject_con {
276 width: 1200px;
277 margin: 0 auto;
278 overflow: hidden;
279 }
280 .common_question .subject, .interact{
281 border-radius: 2px;
282 width: 48%;
283 border: 1px solid #DEDEDE;
284 background-color: #ffffff;
285 }
286 .common_question .list_content , .list_content_right{
287 padding: 10px 20px 20px 20px;
288 box-sizing: border-box;
289 }
290 .common_question .list_content dd {
291 height: 50px;
292 line-height: 50px;
293 }
294 .common_question .list_content dd a{
295 display: inline-block;
296 width: 40%;
297 height: 50px;
298 line-height: 50px;
299 border-bottom: 1px dotted #DEDEDE;
300 }
301 .common_question .list_content dd a:hover {
302 color: #f46143;
303 }
304 .common_question .list_content dd a:first-child {
305 float: left;
306 }
307 .common_question .list_content dd a:last-child {
308 float: right;
309 }
310 .common_question .list_content dd:last-child a{
311 border: none;
312 }
313 .common_question .subject {
314 float: left;
315 }
316 .common_question .interact {
317 float: right;
318 }
319
320 .common_question .title h2 a{
321 display: block;
322 padding: 20px;
323 box-sizing: border-box;
324 height: 60px;
325 box-sizing: border-box;
326 border-bottom: 1px solid #E6E6E6;
327 width: 100%;
328 }
329 .common_question .title h2 a p{
330 font-weight: 600;
331 color: #4A4A4A;
332 float: left;
333 height: 36px;
334 border-bottom: 2px solid #006CFF;
335 }
336 .common_question .title h2 a p span {
337 position: relative;
338 }
339
340 .common_question .title h2 i{
341 font-style: normal;
342 float: right;
343 font-size: 14px;
344 color: #9B9B9B;
345 }
346 .common_question .title h2 i:hover {
347 color: #f46143;
348 }
349 .common_question .list_content_right {
350 text-align: center;
351 padding-bottom: 8px;
352 box-sizing: border-box;
353 overflow: hidden;
354 }
355 .common_question .list_content_right dd{
356 width: 49%;
357 float: left;
358 height: 130px;
359 text-align: center;
360 }
361 .common_question .list_content_right dd {
362 border-right: 1px dotted #DEDEDE;
363 border-bottom: 1px dotted #DEDEDE;
364 }
365 .common_question .list_content_right dd:nth-of-type(n+3) {
366 border-bottom: none;
367 }
368 .common_question .list_content_right dd:nth-child(even){
369 border-right: none;
370 }
371 .common_question .list_content_right dd a {
372 display: block;
373 position: relative;
374 top:50%;
375 height: 70px;
376 transform:translateY(-50%);
377 }
378 .common_question .list_content_right dd a img{
379 width: 70px;
380 height: 70px;
381 display: inline-block;
382 }
383 .common_question .list_content_right dd a p{
384 display: inline-block;
385 position: relative;
386 left: 0;
387 top: -25px;
388 }
389 /* -----------------end---------------------------- */
223 div.c_one { 390 div.c_one {
224 } 391 }
225 392
...@@ -364,6 +531,7 @@ div.c_two ul li { ...@@ -364,6 +531,7 @@ div.c_two ul li {
364 margin-left: 2.88%; 531 margin-left: 2.88%;
365 padding: 40px 36px; 532 padding: 40px 36px;
366 border: 1px solid #E6E6E6; 533 border: 1px solid #E6E6E6;
534 background: #ffffff;
367 } 535 }
368 536
369 div.c_two ul li:first-child { 537 div.c_two ul li:first-child {
...@@ -382,11 +550,13 @@ div.c_two ul li p { ...@@ -382,11 +550,13 @@ div.c_two ul li p {
382 } 550 }
383 551
384 div.c_three { 552 div.c_three {
553 width: 100%;
554 background: #F6F9FB;
385 } 555 }
386 556
387 div.c_three div:first-child { 557 div.c_three div:first-child {
388 width: 1200px; 558 width: 1200px;
389 height: 650px; 559 height: 360px;
390 } 560 }
391 div.c_three .c_t_banner{ 561 div.c_three .c_t_banner{
392 float: left; 562 float: left;
...@@ -413,32 +583,126 @@ width: 100%; ...@@ -413,32 +583,126 @@ width: 100%;
413 width: 50%; 583 width: 50%;
414 } 584 }
415 585
416 div.c_four {
417 background-color: #006bf9;
418 }
419
420 div.c_four div:first-child { 586 div.c_four div:first-child {
421 width: 1200px; 587 width: 1200px;
422 height: 240px; 588 height: 240px;
423 background-color: #7ed74e; 589 background-color: #7ed74e;
424 } 590 }
425 591 /* -----------------友情链接-------------------------- */
426 div.c_five { 592 div.c_five h2 {
593 text-align: center;
594 font-size: 24px;
595 margin-bottom: 30px;
427 } 596 }
428
429 div.c_five div:first-child { 597 div.c_five div:first-child {
430 width: 1200px; 598 width: 1200px;
431 height: 370px; 599 padding: 40px 0 20px 0;
432 background-color: #5cf9ff;
433 } 600 }
434 601 div.c_five ul {
435 602 width: 100%;
603 height: auto;
604 overflow: hidden;
605 }
606 div.c_five ul li{
607 float: left;
608 width: 25%;
609 padding-right: 20px;
610 box-sizing: border-box;
611 margin-bottom: 20px;
612 }
613 div.c_five ul li:nth-child(4n+4) {
614 padding-right: 0;
615 }
616 div.c_five ul li a {
617 display: block;
618 height: 60px;
619 border-radius: 1px;
620 border: 1px solid #DEDEDE;
621 box-sizing: border-box;
622 width: 100%;
623 box-sizing: border-box;
624 }
625 div.c_five ul li a img {
626 height: 100%;
627 }
628 /* -----------------底部start----------------------------- */
436 div.footer { 629 div.footer {
437 background-color: #233042; 630 background-color: #233042;
438 } 631 }
439 632 div.footer .system_service {
440 div.footer div:first-child { 633 width: 100%;
441 background-color: red; 634 border-bottom: 1px solid #4A4A4A;
635 }
636 div.footer .system_service ul {
637 padding: 40px 0;
638 width: 1400px;
639 margin: 0 auto;
640 font-size: 0;
641 }
642 div.footer .system_service ul li {
643 width: 20%;
644 display: inline-block;
645 text-align: center;
646 height: 18px;
647 box-sizing: border-box;
648 }
649 div.footer .system_service ul li:not(:last-child) {
650 border-right: 1px solid #6D7278;
651 }
652 div.footer .system_service ul li a{
653 font-size: 16px;
654 font-weight: 400;
655 color: #DEDEDE;
656 }
657 .footer .subject {
442 width: 1200px; 658 width: 1200px;
443 padding: 32px 0; 659 margin: 0 auto;
660 padding: 40px 0;
661 overflow: hidden;
662 }
663 .footer .subject .footer_logo {
664 float: left;
665 }
666 .footer .subject .footer_logo a{
667 display: block;
668 width: 64px;
669 height: 74px;
670 padding: 10px;
444 } 671 }
672 .footer .subject .footer_logo a img {
673 width: 100%;
674 height: 100%;
675 }
676 .footer .subject ul, ol {
677 float: left;
678 color: #CBCBCB;
679 text-align: left;
680 }
681 .footer .subject ul {
682 width: 73%;
683 box-sizing: border-box;
684 padding-left: 40px;
685 margin-top: 10px;
686 }
687 .footer .subject ul li {
688 width: 30%;
689 display: inline-block;
690 text-align: left;
691 margin-bottom: 30px;
692 }
693 .footer .subject ol li {
694 display: inline-block;
695 text-align: center;
696 }
697 .footer .subject ol li:last-child {
698 margin-left: 60px;
699 }
700 .footer .subject ol li img {
701 width: 80px;
702 height: 80px;
703 }
704 .footer .subject ol li p {
705 font-size: 12px;
706 color: #CBCBCB;
707 margin-top: 5px;
708 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -125,8 +125,8 @@ ...@@ -125,8 +125,8 @@
125 </div> 125 </div>
126 </div> 126 </div>
127 <!-- 法律法规 --> 127 <!-- 法律法规 -->
128 <div class="laws_regulations "> 128 <div class="laws_regulations">
129 <div class="regulations"> 129 <div class="regulations title">
130 <h2> 130 <h2>
131 <a href=""> 131 <a href="">
132 <p> 132 <p>
...@@ -135,68 +135,284 @@ ...@@ -135,68 +135,284 @@
135 <i>查看全部 ></i> 135 <i>查看全部 ></i>
136 </a> 136 </a>
137 </h2> 137 </h2>
138 <ul class="laws_list">
139 <li>
140 <a href="">
141 基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题
142 </a>
143 </li>
144 <li>
145 <a href="">
146 一手商品房办证
147 </a>
148 </li>
149 <li>
150 <a href="">
151 二手商品房办证
152 </a>
153 </li>
154 <li>
155 <a href="">
156 经济适用房登记
157 </a>
158 </li>
159 <li>
160 <a href="">
161 变更登记
162 </a>
163 </li>
164 <li>
165 <a href="">
166 变更登记变更登记
167 </a>
168 </li>
169 </ul>
138 </div> 170 </div>
139 <div class="policy"> 171 <div class="policy title">
140 你的内容 3/12 172 <h2>
173 <a href="">
174 <p>
175 <span>相应政策</span>
176 </p>
177 <i>查看全部 ></i>
178 </a>
179 </h2>
180 <ul class="laws_list">
181 <li>
182 <a href="">
183 基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题基础问题
184 </a>
185 </li>
186 <li>
187 <a href="">
188 一手商品房办证
189 </a>
190 </li>
191 <li>
192 <a href="">
193 二手商品房办证
194 </a>
195 </li>
196 <li>
197 <a href="">
198 经济适用房登记
199 </a>
200 </li>
201 <li>
202 <a href="">
203 变更登记
204 </a>
205 </li>
206 <li>
207 <a href="">
208 变更登记变更登记
209 </a>
210 </li>
211 </ul>
141 </div> 212 </div>
142 </div> 213 </div>
143 <div class="c_three"> 214 <!-- 好差评 -->
144 <div class="subject"> 215 <div class="Good_bad_reviews">
145 <a class="c_t_banner" href=""><img src="images/three_img.jpg" /></a> 216 <img src="./images/bannerbg.png" title="背景">
146 <dl> 217 </div>
147 <dt> 218 <!-- 常见问题，政民互动 -->
148 <h2>常见问题</h2> 219 <div class="common_question">
220 <div class="subject_con">
221 <dl class="subject">
222 <dt class="title">
223 <h2>
224 <a href="">
225 <p>
226 <span>常见问题</span>
227 </p>
228 <i>查看全部 ></i>
229 </a>
230 </h2>
149 </dt> 231 </dt>
150 <dd><a href="">基础问题</a></dd> 232 <div class="list_content">
151 <dd><a href="">继承登记</a></dd> 233 <dd>
152 <dd><a href="">一手商品房办证</a></dd> 234 <a href="">基础问题</a>
153 <dd><a href="">抵押登记</a></dd> 235 <a href="">继承登记</a>
154 <dd><a href="">二手房办证</a></dd> 236 </dd>
155 <dd><a href="">预售及网签</a></dd> 237 <dd>
156 <dd><a href="">经济适用房登记</a></dd> 238 <a href="">一手商品房办证</a>
157 <dd><a href="">夫妻加减名变更</a></dd> 239 <a href="">抵押登记</a>
158 <dd><a href="">变更登记</a></dd> 240 </dd>
159 <dd><a href="">夫妻离婚变更</a></dd> 241 <dd>
242 <a href="">二手房办证</a>
243 <a href="">预售及网签</a>
244 </dd>
245 <dd>
246 <a href="">经济适用房登记</a>
247 <a href="">夫妻加减名变更</a>
248 </dd>
249 <dd>
250 <a href="">变更登记</a>
251 <a href="">夫妻离婚变更</a>
252 </dd>
253 </div>
160 </dl> 254 </dl>
161 <dl class="interact"> 255 <dl class="interact">
162 <dt> 256 <dt class="title">
163 <h2>政民互动</h2> 257 <h2>
258 <a href="">
259 <p>
260 <span>政民互动</span>
261 </p>
262 <i>查看全部 ></i>
263 </a>
264 </h2>
164 </dt> 265 </dt>
165 <dd> 266 <div class="list_content_right">
166 <a> 267 <dd>
167 <img src="" /> 268 <a>
168 <p>在线评价</p> 269 <img src="./images/two_s_1.jpg" />
169 </a> 270 <p>在线评价</p>
170 </dd> 271 </a>
171 <dd> 272 </dd>
172 <a> 273 <dd>
173 <img src="" /> 274 <a>
174 <p>在线留言</p> 275 <img src="./images/two_s_1.jpg" />
175 </a> 276 <p>在线留言</p>
176 </dd> 277 </a>
177 <dd> 278 </dd>
178 <a> 279 <dd>
179 <img src="" /> 280 <a>
180 <p>征集调查</p> 281 <img src="./images/two_s_1.jpg" />
181 </a> 282 <p>征集调查</p>
182 </dd> 283 </a>
183 <dd> 284 </dd>
184 <a> 285 <dd>
185 <img src="" /> 286 <a>
186 <p>即时聊天</p> 287 <img src="./images/two_s_1.jpg" />
187 </a> 288 <p>即时聊天</p>
188 </dd> 289 </a>
290 </dd>
291 </div>
292
189 </dl> 293 </dl>
190 </div> 294 </div>
191 </div> 295 </div>
192 <div class="c_four"> 296 <!-- 友情链接 -->
193 <div class="subject"> dfadfasdf</div> 297 <div class="c_five Links">
194 </div> 298 <div class="subject">
195 <div class="c_five"> 299 <h2>
196 <div class="subject"> dfadfasdf</div> 300 <a href="">
301 友情链接
302 </a>
303 </h2>
304 <ul>
305 <li>
306 <a href="">
307 <img src="./images/guotuziyuanbao.png">
308 </a>
309 </li>
310 <li>
311 <a href="">
312 <img src="./images/zhongyangzhengfuwang.png">
313 </a>
314 </li>
315 <li>
316 <a href="">
317 <img src="./images/zhongyangzhengfuwang.png">
318 </a>
319 </li>
320 <li>
321 <a href="">
322 <img src="./images/guotuziyuanbao.png">
323 </a>
324 </li>
325 <li>
326 <a href="">
327 <img src="./images/guotuziyuanbao.png">
328 </a>
329 </li>
330 <li>
331 <a href="">
332 <img src="./images/zhongyangzhengfuwang.png">
333 </a>
334 </li>
335 <li>
336 <a href="">
337 <img src="./images/guotuziyuanbao.png">
338 </a>
339 </li>
340 <li>
341 <a href="">
342 <img src="./images/zhongyangzhengfuwang.png">
343 </a>
344 </li>
345 </ul>
346 </div>
197 </div> 347 </div>
198 <div class="footer"> 348 <div class="footer">
199 <div class="subject"> dfadfasdf</div> 349 <div class="system_service">
350 <ul class="">
351 <li>
352 <a href="">
353 <span>公示公告</span>
354 </a>
355 </li>
356 <li>
357 <a href="">
358 <span>法律法规</span>
359 </a>
360 </li>
361 <li>
362 <a href="">
363 <span>相应政策</span>
364 </a>
365 </li>
366 <li>
367 <a href="">
368 <span>下载服务</span>
369 </a>
370 </li>
371 <li>
372 <a href="">
373 <span>关于我们</span>
374 </a>
375 </li>
376 </ul>
377 </div>
378 <div class="subject">
379 <div class="footer_logo">
380 <a href="">
381 <img src="./images/jiguan.png">
382 </a>
383 </div>
384 <ul>
385 <li>
386 西安市自然资源和规划局
387 </li>
388 <li>
389 电话：028-456465
390 </li>
391 <li>
392 地址：西安市丰城8路
393 </li>
394 <li>
395 网站标识吗：87987987
396 </li>
397 <li>
398 备案：陕IPC456465465
399 </li>
400 <li>
401 陕公网备案：456465465
402 </li>
403 </ul>
404 <ol>
405 <li>
406 <img src="./images/code.png">
407 <p>扫描关注公众号</p>
408 </li>
409 <li>
410 <img src="./images/code.png">
411 <p>扫描关注公众号</p>
412 </li>
413
414 </ol>
415 </div>
200 </div> 416 </div>
201 417
202 </body> 418 </body>
......