1 <!doctype html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>伴手礼</title>
6 <link rel="stylesheet" href="css/reset.css">
7 <style>
8 *
9 {
10 margin: 0;
11 padding: 0;
12 }
13 .head
14 {
15 border-bottom: 4px solid #176fbb;
16 min-width: 1000px;
17 }
18 .zhongjiansanbufen
19 {
20 width: 1000px;
21 margin: 0 auto;
22 overflow: hidden;
23 }
24 .liuwan
25 {
26 width: 132px;
27 height: 91px;
28 padding-top: 14px;
29 float: left;
30 }
31 .shangdao
32 {
33 width: 567px;
34 height: 28px;
35 margin-left: 273px;
36 margin-top: 15px;
37 float: left;
38 }
39 .tel
40 {
41 float: left;
42 }
43 .shuzi
44 {
45 padding-left: 20px;
46 padding-right: 15px;
47 margin-top: 2px;
48 background: url(images/电话.png) no-repeat;
49 border-right: 2px solid #3c3c3c;
50 }
51 .denglu
52 {
53 margin-top: 3px;
54 border-right: 2px solid #3c3c3c;
55 margin-left: 15px;
56 padding-right: 15px;
57 float: left;
58 }
59 .zhuce
60 {
61 padding-left: 15px;
62 padding-right: 15px;
63 float: left;
64 margin-top: 2px;
65 border-right: 2px solid #3c3c3c;
66 }
67 .xinglixiang
68 {
69 float: left;
70 margin-left: 15px;
71 }
72 .xlx
73 {
74 padding-left: 34px;
75 padding-right: 15px;
76 margin-top: 2px;
77 background: url(images/行李箱.png) no-repeat;
78 }
79 .sousuokuang
80 {
81 float: left;
82 }
83 .ssk
84 {
85 width: 150px;
86 height: 24px;
87 color: #3c3c3c;
88 }
89 .fangdajing
90 {
91 float: left;
92 }
93 .xiadao
94 {
95 width: 657px;
96 float: left;
97 margin-left: 56px;
98 margin-top: 40px;
99 margin-bottom: 8px;
100 }
101 .diyici
102 {
103 padding-left: 38px;
104 background: url(images/房子.png) no-repeat;
105 }
106 .mudi
107 {
108 padding-left: 40px;
109 }
110 .techan
111 {
112 color: #176fbb;
113 padding-left: 40px;
114 }
115 .shouye
116 {
117 min-width: 1000px;
118 margin: 0 auto;
119 width: 100%;
120 }
121 .sy
122 {
123 width: 1000px;
124 height: 53px;
125 line-height: 53px;
126 margin: 0 auto ;
127 }
128 .datu
129 {
130 height: 350px;
131 background: url(images/台湾.jpg) center center no-repeat;
132 }
133 .zhongbudiqu
134 {
135 width: 1000px;
136 margin: 0 auto;
137 }
138 .libao
139 {
140 color: #cc0000;
141 margin: 0 auto;
142 font-weight: bold;
143 margin-top: 30px;
144 }
145 .lb
146 {
147 background: url(images/礼包.png) 429px top no-repeat;
148 height: 28px;
149 margin-left: 15px;
150 padding-left: 15px;
151 text-align: center;
152 padding-top: 10px;
153 }
154 .liudatu
155 {
156 margin-top: 29px;
157 overflow: hidden;
158 }
159 .zuoshang
160 {
161 width: 314px;
162 height: 222px;
163 background: url(images/牛轧糖.png) no-repeat;
164 float: left;
165 }
166 .yinying
167 {
168 width: 314px;
169 height: 222px;
170 background: url(images/阴影.png) no-repeat;
171 position: relative;
172 }
173 .hongxin
174 {
175 position: absolute;
176 left: 96px;
177 top: 34px;
178 padding-left: 19px;
179 background: url(images/红心.png) no-repeat;
180 }
181 .lanxin
182 {
183 position: absolute;
184 left: 168px;
185 top: 34px;
186 padding-left: 19px;
187 background: url(images/蓝心.png) no-repeat;
188 }
189 .nx
190 {
191 position: absolute;
192 left: 60px;
193 top: 67px;
194 color: #ffffff;
195 }
196 .hc
197 {
198 position: absolute;
199 left: 59px;
200 top: 104px;
201 color: #ffffff;
202 }
203 .qie
204 {
205 position: absolute;
206 left:89px;
207 top: 122px;
208 color: #ffffff;
209 }
210 .huabian
211 {
212 position: absolute;
213 left: 20px;
214 bottom: 31px;
215 width: 275px;
216 height: 38px;
217 background: url(images/白色礼包.png) no-repeat;
218 }
219 .shangzhong
220 {
221 width: 313px;
222 height: 222px;
223 background: url(images/凤梨酥.png) no-repeat;
224 float: left;
225 margin-left: 28px;
226 position: relative;
227 }
228 .yinying2
229 {
230 position: absolute;
231 left: 0;
232 bottom: 0;
233 width: 313px;
234 height: 30px;
235 line-height: 30px;
236 background: url(images/阴影2.png) no-repeat;
237 }
238 .fenglisu
239 {
240 position: absolute;
241 left: 0;
242 bottom: 0;
243 width: 313px;
244 height: 30px;
245 line-height: 30px;
246 color: #ffffff;
247 text-align: center;
248 }
249 .shangzhong:hover .yinying2
250 {
251 display: none;
252 }
253 .shangzhong:hover .fenglisu
254 {
255 display: none;
256 }
257 .yinying
258 {
259 display: none;
260 }
261 .shangzhong:hover .yinying
262 {
263 display: block;
264 }
265 .yin
266 {
267 display: block;
268 }
269 .shangyou
270 {
271 width: 314px;
272 height: 222px;
273 background: url(images/牛轧糖好吃.jpg) no-repeat;
274 float: left;
275 margin-left: 29px;
276 position: relative;
277 }
278 .shangyou:hover .yinying
279 {
280 display: block;
281 }
282 .shangyou:hover .fenglisu
283 {
284 display: none;
285 }
286 .shangyou:hover .yinying2
287 {
288 display: none;
289 }
290 .xiazuo
291 {
292 width: 314px;
293 height: 222px;
294 margin-top: 28px;
295 background: url(images/羊羹.jpg) no-repeat;
296 float: left;
297 position: relative;
298 }
299 .xiazuo:hover .yinying
300 {
301 display: block;
302 }
303 .xiazuo:hover .fenglisu
304 {
305 display: none;
306 }
307 .xiazuo:hover .yinying2
308 {
309 display: none;
310 }
311 .xiazhong
312 {
313 width: 314px;
314 height: 222px;
315 background: url(images/牛轧糖.png) no-repeat;
316 float: left;
317 position: relative;
318 margin-top: 28px;
319 margin-left: 29px;
320 }
321 .xiazhong:hover .yinying
322 {
323 display: block;
324 }
325 .xiazhong:hover .fenglisu
326 {
327 display: none;
328 }
329 .xiazhong:hover .yinying2
330 {
331 display: none;
332 }
333 .xiayou
334 {
335 width: 314px;
336 height: 222px;
337 margin-top: 28px;
338 margin-left: 29px;
339 background: url(images/蛋糕.jpg) no-repeat;
340 float: left;
341 position: relative;
342 }
343 .xiayou:hover .yinying
344 {
345 display: block;
346 }
347 .xiayou:hover .fenglisu
348 {
349 display: none;
350 }
351 .xiayou:hover .yinying2
352 {
353 display: none;
354 }
355 .fanye
356 {
357 width: 1000px;
358 float:left;
359 margin-top: 39px;
360 }
361 .shangyiye
362 {
363 float: left;
364 margin-left: 371px;
365 }
366 .shuzi1
367 {
368 float: left;
369 margin-left: 14px;
370 }
371 .shengluehao
372 {
373 float: left;
374 margin-left: 7px;
375 }
376 .shuzi12
377 {
378 float: left;
379 margin-left: 8px;
380
381 }
382 .shuzi13
383 {
384 background-color: #6e6e6e;
385 width: 30px;
386 height: 20px;
387 float: left;
388 margin-left: 11px;
389 }
390 .shuzi14
391 {
392 margin-left: 10px;
393 float: left;
394 }
395 .shengluehao2
396 {
397 float: left;
398 margin-left: 9px;
399 }
400 .shuzi40
401 {
402 float: left;
403 margin-left: 9px;
404 }
405 .xiayiye
406 {
407 float: left;
408 margin-left: 12px;
409 }
410 .dibuxinxi
411 {
412 margin-top: 30px;
413 overflow: hidden;
414 width: 100%;
415 min-width: 1000px;
416 background-color:#023c4d;
417 }
418 .xinxishang
419 {
420
421 width: 1000px;
422 color: #ffffff;
423 overflow: hidden;
424 margin: 0 auto;
425 }
426 .diyilie
427 {
428 float: left;
429 padding-left: 102px;
430 float: left;
431 }
432 .l1
433 {
434 padding-top: 22px;
435 font-size: 18px;
436 font-weight: bold;
437 }
438 .l2
439 {
440 padding-top: 11px;
441 font-size: 14px;
442 }
443 .l3,.l4,.l5
444 {
445 padding-top: 15px;
446 font-size: 14px;
447 }
448 .dierlie
449 {
450 float: left;
451 margin-left: 80px;
452 float: left;
453 }
454 .disanlie
455 {
456 float: left;
457 margin-left: 80px;
458 float: left;
459 }
460 .disilie
461 {
462 float: left;
463 margin-left: 80px;
464 float: left;
465 }
466 .l6
467 {
468 padding-top: 22px;
469 font-size: 14px;
470 }
471 .diwulie
472 {
473 float: left;
474 margin-left: 80px;
475 float: left;
476 }
477 .l7
478 {
479 font-size: 18px;
480 padding-top: 18px;
481 }
482 .xinxixia
483 {
484 border-top:1px solid #ffffff;
485 margin-top: 22px;
486 }
487 .dibukuang
488 {
489 height: 57px;
490 line-height: 57px;
491 width: 1000px;
492 margin: 0 auto;
493 }
494 .pp
495 {
496 text-align: center;
497 color: #ffffff;
498 }
499 </style>
500 </head>
501 <body>
502 <div class="head"><!-- 遛弯导航栏 -->
503 <div class="zhongjiansanbufen"><!-- 中间三部分 -->
504 <div class="liuwan"><!-- 第一部分 遛弯-->
505 <img src="img/遛弯.png" alt="">
506 </div>
507 <div class="shangdao"><!-- 第二部分 顶部导航栏 -->
508 <div class="tel"><!-- 电话号码 -->
509 <p class="shuzi">400-800-8820</p>
510 </div>
511 <div class="denglu"><!-- 登录 -->
512 登录
513 </div>
514 <div class="zhuce"><!-- 注册 -->
515 注册
516 </div>
517 <div class="xinglixiang"><!-- 行李箱 -->
518 <p class="xlx">行李箱</p>
519 </div>
520 <div class="sousuokuang"><!-- 搜索框 -->
521 <input type="text" class="ssk">
522 </div>
523 <div class="fangdajing">
524 <img src="images/搜索.png" alt="">
525 </div>
526 </div>
527 <div class="xiadao"><!-- 第三部分 下部导航栏 -->
528 <span class="diyici"><!-- 第一次 -->
529 第一次
530 </span>
531 <span class="mudi"><!-- 目的地 -->
532 目的地
533 </span>
534 <span class="mudi"><!-- 自定行程 -->
535 自定行程
536 </span>
537 <span class="mudi"><!-- 游记 -->
538 游记
539 </span>
540 <span class="techan"><!-- 特产 -->
541 特产
542 </span>
543 <span class="mudi"><!-- 优惠 -->
544 优惠
545 </span>
546 <span class="mudi"><!-- 环岛巴士 -->
547 环岛巴士
548 </span>
549 </div>
550 </div>
551 </div>
552 <div class="shouye"><!-- 首页大图部分 -->
553 <div class="sy"><!-- 首页>伴手礼 -->
554 首页>伴手礼
555 </div>
556 <div class="datu"><!-- 台湾大图 -->
557 </div>
558 </div>
559 <div class="zhongbudiqu"><!-- 中间六大图部分 -->
560 <div class="libao"><!-- 礼包 -->
561 <p class="lb">伴手礼</p>
562 </div>
563 <div class="liudatu"><!-- 六大图 -->
564 <div class="zuoshang"><!-- 上左图 -->
565 <div class="yinying yin"><!-- 阴影 -->
566 <div class="hongxin"><!-- 红心 -->
567 1168
568 </div>
569 <div class="lanxin"><!-- 蓝心 -->
570 1168
571 </div>
572 <div class="nx">
573 浓香的奶味和果仁的牛轧糖
574 </div>
575 <div class="hc">
576 好吃不黏牙，而且越嚼越香，而
577 </div>
578 <div class="qie">
579 且是不含香料和色素...
580 </div>
581 <div class="huabian"><!-- 白色花边 -->
582 </div>
583 </div>
584 </div>
585 <div class="shangzhong"><!-- 上中图 -->
586 <div class="yinying2"><!-- 小阴影 -->
587 </div>
588 <div class="fenglisu"><!-- 凤梨酥 -->
589 凤梨酥
590 </div>
591 <div class="yinying"><!-- 阴影 -->
592 <div class="hongxin"><!-- 红心 -->
593 1168
594 </div>
595 <div class="lanxin"><!-- 蓝心 -->
596 1168
597 </div>
598 <div class="nx">
599 浓香的奶味和果仁的牛轧糖
600 </div>
601 <div class="hc">
602 好吃不黏牙，而且越嚼越香，而
603 </div>
604 <div class="qie">
605 且是不含香料和色素...
606 </div>
607 <div class="huabian"><!-- 白色花边 -->
608 </div>
609 </div>
610 </div>
611 <div class="shangyou"><!-- 上右图 -->
612 <div class="yinying2"><!-- 小阴影 -->
613 </div>
614 <div class="fenglisu"><!-- 凤梨酥 -->
615 浓香的奶味和果仁的牛轧糖
616 </div>
617 <div class="yinying"><!-- 阴影 -->
618 <div class="hongxin"><!-- 红心 -->
619 1168
620 </div>
621 <div class="lanxin"><!-- 蓝心 -->
622 1168
623 </div>
624 <div class="nx">
625 浓香的奶味和果仁的牛轧糖
626 </div>
627 <div class="hc">
628 好吃不黏牙，而且越嚼越香，而
629 </div>
630 <div class="qie">
631 且是不含香料和色素...
632 </div>
633 <div class="huabian"><!-- 白色花边 -->
634 </div>
635 </div>
636 </div>
637 <div class="xiazuo"><!-- 下左图 -->
638 <div class="yinying2"><!-- 小阴影 -->
639 </div>
640 <div class="fenglisu"><!-- 羊羹 -->
641 羊羹
642 </div>
643 <div class="yinying"><!-- 阴影 -->
644 <div class="hongxin"><!-- 红心 -->
645 1168
646 </div>
647 <div class="lanxin"><!-- 蓝心 -->
648 1168
649 </div>
650 <div class="nx">
651 浓香的奶味和果仁的牛轧糖
652 </div>
653 <div class="hc">
654 好吃不黏牙，而且越嚼越香，而
655 </div>
656 <div class="qie">
657 且是不含香料和色素...
658 </div>
659 <div class="huabian"><!-- 白色花边 -->
660 </div>
661 </div>
662 </div>
663 <div class="xiazhong"><!-- 下中图 -->
664 <div class="yinying2"><!-- 小阴影 -->
665 </div>
666 <div class="fenglisu"><!-- 浓香的奶味和果仁的牛轧糖 -->
667 浓香的奶味和果仁的牛轧糖
668 </div>
669 <div class="yinying"><!-- 阴影 -->
670 <div class="hongxin"><!-- 红心 -->
671 1168
672 </div>
673 <div class="lanxin"><!-- 蓝心 -->
674 1168
675 </div>
676 <div class="nx">
677 浓香的奶味和果仁的牛轧糖
678 </div>
679 <div class="hc">
680 好吃不黏牙，而且越嚼越香，而
681 </div>
682 <div class="qie">
683 且是不含香料和色素...
684 </div>
685 <div class="huabian"><!-- 白色花边 -->
686 </div>
687 </div>
688 </div>
689 <div class="xiayou"><!-- 下右图 -->
690 <div class="yinying2"><!-- 小阴影 -->
691 </div>
692 <div class="fenglisu"><!-- 凤梨酥 -->
693 凤梨酥
694 </div>
695 <div class="yinying"><!-- 阴影 -->
696 <div class="hongxin"><!-- 红心 -->
697 1168
698 </div>
699 <div class="lanxin"><!-- 蓝心 -->
700 1168
701 </div>
702 <div class="nx">
703 浓香的奶味和果仁的牛轧糖
704 </div>
705 <div class="hc">
706 好吃不黏牙，而且越嚼越香，而
707 </div>
708 <div class="qie">
709 且是不含香料和色素...
710 </div>
711 <div class="huabian"><!-- 白色花边 -->
712 </div>
713 </div>
714 </div>
715 <div class="fanye"><!-- 翻页 -->
716 <span class="shangyiye">
717 上一页
718 </span><!-- 上一页 -->
719 <span class="shuzi1">
720 1
721 </span><!-- 1 -->
722 <span class="shengluehao">
723 .....
724 </span><!-- 省略号 -->
725 <span class="shuzi12">
726 12
727 </span><!-- 12 -->
728 <span class="shuzi13">
729 13
730 </span><!-- 13 -->
731 <span class="shuzi14"><!-- 14 -->
732 14
733 </span>
734 <span class="shengluehao2"><!-- 省略号 -->
735 .....
736 </span>
737 <span class="shuzi40"><!-- 40 -->
738 40
739 </span>
740 <span class="xiayiye"> <!-- 下一页 -->
741 下一页
742 </span>
743 </div>
744 </div>
745 </div>
746 <div class="dibuxinxi"><!-- 底部信息栏 -->
747 <div class="xinxishang"><!-- 信息栏上部分 -->
748 <ul class="diyilie"><!-- 1 -->
749 <li class="l1">关于遛弯</li>
750 <li class="l2">公司简介</li>
751 <li class="l3">联系我们</li>
752 <li class="l3">诚聘英才</li>
753 <li class="l3">网站地址</li>
754 </ul>
755 <ul class="dierlie"><!-- 2 -->
756 <li class="l1">帮助中心</li>
757 <li class="l2">赴台手续</li>
758 <li class="l3">遛弯玩法</li>
759 <li class="l3">常见问题</li>
760 </ul>
761 <ul class="disanlie"><!-- 3 -->
762 <li class="l1">网站条款</li>
763 <li class="l2">服务条款</li>
764 <li class="l3">免责声明</li>
765 </ul>
766 <ul class="disilie"><!-- 4 -->
767 <li class="l1">关注我们</li>
768 <li class="l6"><img src="images/微信logo.png" alt=""></li>
769 </ul>
770 <ul class="diwulie"><!-- 5 -->
771 <li class="l1">400 820 8820</li>
772 <li class="l7">周一至周日</li>
773 <li class="l7">9:00~20:00</li>
774 <li class="l7"><img src="images/在线服务.jpg" alt=""></li>
775 </ul>
776 </div>
777 <div class="xinxixia"><!-- 信息栏下部分 -->
778 <div class="dibukuang">
779 <p class="pp">
780 Copyright © 2013-2014 www.6waner.cn All Right Reserved. 京ICP备11015236号
781 </p>
782 </div>
783 </div>
784 </div>
785 </body>
786 </html>
