zoukankan      html  css  js  c++  java
  • 累成狗做出来的

      1 <!doctype html>
      2 <html lang="en">
      3 <head>
      4     <meta charset="UTF-8">
      5     <title>Document</title>
      6     <style>
      7         *
      8         {
      9             margin: 0;
     10             padding:0;
     11         }
     12         .head
     13         {
     14             border-bottom: 4px solid #176fbb;
     15         }
     16         .headcon
     17         {
     18             width: 1000px;
     19             margin: 0 auto;/*居中*/
     20             overflow: hidden;
     21             padding-top: 15px;
     22             padding-bottom: 9px;
     23         }
     24         .head1
     25         {
     26             float: left;
     27         }
     28         .head2
     29         {
     30             float: right;
     31         }
     32         .banners
     33         {
     34             float: left;
     35             margin-right: 14px;
     36             font-family: "微软雅黑";
     37             font-size: 14px;
     38             color: #505050;
     39             text-decoration: none;
     40 
     41         }
     42         .headborder
     43         {
     44             border-right: 2px solid #3c3c3c;
     45             padding-right: 14px;
     46         }
     47         .headinp
     48         {
     49             width: 151px;
     50             height: 24px;
     51             margin-right: 0px;
     52         }
     53         .phone
     54         {
     55             margin-top: -1px;
     56         }
     57         .xinglixiang
     58         {
     59             margin-top: -5px;
     60         }
     61         .sousuo
     62         {
     63             margin-top: -6px;
     64         }
     65         .head3
     66         {
     67             float: left;
     68             margin-left: 56px;
     69             margin-top: 40px;
     70         }
     71         .head3 a
     72         {
     73             font-family: "微软雅黑";
     74             font-size: 18px;
     75             color: #3c3c3c;
     76             text-decoration: none;
     77             margin-left: 38px;
     78         }
     79         .d1
     80         {
     81             overflow: hidden;
     82         }
     83         .banshouli
     84         {
     85             
     86             height: 53px;
     87             width: 1000px;
     88             line-height: 53px;
     89             margin: 0 auto;
     90         }
     91         .datu
     92         {
     93             width: 100%;
     94             height: 350px;
     95             min-width: 1000px;
     96             margin: 0 auto;
     97             background: url(img/大图.jpg) center center no-repeat;
     98         }
     99         .d2
    100         {
    101             width: 1000px;
    102             margin: 0 auto;    
    103             overflow: hidden;
    104         }
    105         .libao
    106         {
    107             padding-top: 30px;
    108             padding-left: 428px;
    109             padding-bottom:29px;
    110             float: left;
    111         }
    112         .banshouli2
    113         {
    114             padding-top: 30px;
    115             margin-left:21px;
    116             font-size: 30px;
    117             font-family: "微软雅黑";
    118             color: #cc0000;
    119             float: left; 
    120         }
    121         .d3
    122         {
    123             width: 1002px;
    124             margin: 0 auto;
    125             overflow: hidden;
    126         }
    127         .picture1
    128         {
    129             width: 314px;
    130             height: 221px;
    131             margin: 15px;
    132             margin-left: 0px;
    133             background: url(img/牛轧糖暗.jpg) center center no-repeat;
    134             float: left;
    135         }
    136         .beijing
    137         {
    138             overflow: hidden;
    139         }
    140         .xin
    141         {
    142             padding-left: 96px;
    143             padding-top: 31px;
    144             float: left;
    145         }
    146         .shuzi
    147         {
    148             padding-top: 30px;
    149             margin-left: 9px;
    150             font-size: 12px;
    151             font-family: "微软雅黑";
    152             color: #ffffff;
    153             float: left;
    154         }
    155         .shenmegui
    156         {
    157             padding-top: 31px;
    158             margin-left: 20px;
    159             float: left;
    160         }
    161         .shuzi1
    162         {
    163             padding-top: 31px;
    164             margin-left: 10px;
    165             font-size: 12px;
    166             font-family: "微软雅黑";
    167             color: #ffffff;    
    168             float: left;
    169         }
    170         .t1
    171         {
    172             padding-top: 20px;
    173             font-size: 16px;
    174             font-family: "微软雅黑";
    175             color: #ffffff;
    176             text-align: center;
    177         }
    178         .t2
    179         {
    180             margin-left: 53px;
    181             margin-right: 53px;
    182             padding-top:20px; 
    183             font-size:14px;
    184             font-family: "微软雅黑";
    185             color: #ffffff;
    186             text-align: center;
    187         }
    188         .huabian
    189         {
    190             width: 275px;
    191             height: 75px;
    192             margin-left: 20px;
    193             padding-top: 18px;
    194             background: url(img/花边.png) center center no-repeat;
    195             float: left;
    196         }
    197         .picture2
    198         {
    199             width: 314px;
    200             height: 221px;
    201             background: url(img/凤梨酥.jpg) center center no-repeat;
    202             /*padding:15px;*/
    203             margin: 15px;
    204             float: left;
    205         }
    206         .fenglisu
    207         {
    208             font-size: 16px;
    209             font-family: "微软雅黑";
    210             color: #74735e;
    211             text-align: center;
    212             padding-top: 200px;
    213         }
    214         .picture3
    215         {
    216             width: 314px;
    217             height: 221px;
    218             background: url(img/牛轧糖.jpg) center center no-repeat;
    219             /*padding-left: 30px;*/
    220             margin: 15px;
    221             margin-right: 0px;
    222             margin-top: 15px;
    223             float: left;
    224         }
    225         .t3
    226         {
    227             font-size: 16px;
    228             font-family: "微软雅黑";
    229             color: #74735e;
    230             text-align: center;
    231             padding-top: 185px;
    232             margin: 15px;
    233         }
    234         .picture4
    235         {
    236             width: 314px;
    237             height: 221px;
    238             background: url(img/羊羹.jpg) center center no-repeat;
    239             margin: 15px;
    240             margin-left: 0px;
    241             float: left;
    242         }
    243         .t4
    244         {
    245             font-size: 16px;
    246             font-family: "微软雅黑";
    247             color: #74735e;
    248             text-align: center;
    249             padding-top: 200px;
    250         }
    251         .picture5
    252         {
    253             width: 314px;
    254             height: 221px;
    255             background: url(img/牛轧糖.jpg) center center no-repeat;
    256             margin: 15px;
    257             float: left;
    258         }
    259         .t5
    260         {
    261             font-size: 16px;
    262             font-family: "微软雅黑";
    263             color: #74735e;
    264             text-align: center;
    265             padding-top: 200px;
    266         }
    267         .picture6
    268         {
    269             width: 314px;
    270             height: 221px;
    271             background: url(img/蛋糕.jpg) center center no-repeat;
    272             margin: 15px;
    273             margin-right: 0px;
    274             float: left;
    275         }
    276         .t6
    277         {
    278             font-size: 16px;
    279             font-family: "微软雅黑";
    280             color: #74735e;
    281             text-align: center;
    282             padding-top: 200px;
    283         }
    284         .d4
    285         {
    286             width: 1000px;
    287             margin: 0 auto;
    288             overflow: hidden;
    289             padding-top: 15px;
    290             font-size: 12px;
    291             font-family: "微软雅黑";
    292             color: #737373;
    293         }
    294         .d4 a
    295         {
    296             float: left;
    297             margin-right: 15px;
    298         }
    299         .shuzi13
    300         {
    301             margin-top:-2px;
    302         }
    303         .shengluehao
    304         {
    305             /*margin-top: 1px;*/
    306         }
    307         .shangyiye
    308         {
    309             padding-left: 370px;
    310         }
    311         .d5
    312         {
    313             height: 179px;
    314             background-color: #023c4d;
    315             border-bottom: 1px solid #ffffff;
    316         }
    317         .d6
    318         {
    319             overflow: hidden;
    320             color: #fff;
    321             font-family: 宋体;
    322             margin: 0 auto;
    323             width: 900px;
    324             padding-left: 104px;
    325 
    326         }
    327         .l1
    328         {
    329             list-style: none;
    330             float: left;
    331             margin-right: 80px;
    332             margin-top: 22px;
    333         }
    334         .l2
    335         {
    336             list-style: none;
    337             float: left;
    338             margin-right: 80px;
    339             margin-top: 22px;
    340 
    341         }
    342         .l3
    343         {
    344             list-style: none;
    345             float: left;
    346             margin-right: 80px;
    347             margin-top: 22px;
    348         }
    349         .l4
    350         {
    351             list-style:none;
    352             float: left;
    353             margin-right: 80px;
    354             margin-top: 22px;
    355         }
    356         .l5
    357         {
    358             list-style:none;
    359             float: left;
    360             margin-top: 22px;
    361         }    
    362         .logo
    363         {
    364             width: 76px;
    365             height: 34px;
    366         }
    367         .guanyu
    368         {
    369             margin-bottom: 10px;
    370         }
    371         .bangzhu
    372         {
    373             margin-bottom: 10px;
    374         }
    375         .wangzhan
    376         {
    377             margin-bottom: 10px;
    378         }
    379         .guanzhu
    380         {
    381             margin-bottom: 10px;
    382         }    
    383         .dianhua1
    384         {
    385             margin-bottom: 10px;
    386         }
    387         .riqi
    388         {
    389             margin-bottom: 10px;
    390         }    
    391         .zaixianfuwuzixun
    392         {
    393             margin-bottom: 10px;
    394         }
    395         .l1 li
    396         {
    397             margin-bottom: 15px;
    398         }
    399         .l2 li
    400         {
    401             margin-bottom: 15px;
    402         }
    403         .l3 li
    404         {
    405             margin-bottom: 15px;
    406         }
    407         .l4 li
    408         {
    409             margin-bottom: 15px;
    410         }
    411         .l5 li
    412         {
    413             margin-bottom: 15px;
    414         }
    415         .d7
    416         {
    417             height: 57px;
    418             background-color: #023c4d;
    419             color: #d0d0d0;
    420             text-align: center;
    421             line-height: 57px;
    422 
    423         }
    424     </style>
    425 </head>
    426 <body>
    427         <!-- 头部部分 -->
    428         <div class="head">
    429             <div class="headcon">
    430                 <div class="head1">
    431                     <img src="img/遛弯.png" alt="">
    432                 </div>
    433                 <div class="head2">
    434                     <img class="banners phone"src="img/小电话.png" alt="">
    435                     <span class="banners headborder">400-800-8820</span>
    436                     <a  class="banners headborder "href="###">登录</a>
    437                     <a class="banners headborder" href="###">注册</a>
    438                     <img class="banners xinglixiang" src="img/锁.png" alt="">
    439                     <span class="banners">行李箱</span>
    440                     <input class="banners headinp sousuo" type="text">
    441                     <img class="banners sousuo" src="img/放大镜.png" alt="">                    
    442                 </div>
    443                 <div class="head3">
    444                     <img src="img/房子.png" alt="">
    445                     <a href="###">第一次</a>
    446                     <a href="###">目的地</a>
    447                     <a href="###">自定行程</a>
    448                     <a href="###">游记</a>
    449                     <a href="###">特产</a>
    450                     <a href="###">优惠</a>
    451                     <a href="###">环岛巴士</a>
    452                     
    453                 </div>
    454             </div>
    455         </div>
    456         <!-- 头部部分结束 -->
    457         <!-- 大图部分开始 -->
    458         <div class="d1">
    459             <p class="banshouli">首页>伴手礼</p>
    460             <div class="datu">
    461             </div>            
    462         </div>
    463         <!-- 大图结束 -->
    464         <!-- 礼包开始 -->
    465         <div class="d2">
    466             <img  class="libao" src="img/礼包.png" alt="">
    467             <div class="banshouli2">伴手礼</div>
    468         </div>
    469         <!-- 礼包结束 -->
    470         <!-- 主体六大图开始 -->
    471         <div class="d3">
    472             <div class="picture1">
    473                 <div class="beijing"><!-- 第一行,心形 -->
    474                     <img class="xin" src="img/心形.png" alt="">
    475                     <p class="shuzi">1168</p>
    476                     <img class="shenmegui" src="img/什么鬼.png" alt="">
    477                     <p class="shuzi1">1168</p>
    478                 </div>
    479                 <div class="t1">
    480                     浓香的奶味和果仁的牛轧糖
    481                 </div>
    482                 <div class="t2">
    483                     好吃的粘牙,而且越嚼越香,而且是不含香料和色素...
    484                 </div>
    485                 <div class="huabian"></div>
    486             </div>
    487             <div class="picture2">
    488                 <div class="fenglisu">凤梨酥</div>
    489             </div>
    490             <div class="picture3">
    491                 <div class="t3">浓香的奶味和果仁的牛轧糖</div>
    492             </div>
    493             <div class="picture4">
    494                 <div class="t4">羊羹</div>
    495             </div>
    496             <div class="picture5">
    497                 <div class="t5">浓香的奶味和果仁的牛轧糖</div>
    498             </div>
    499             <div class="picture6">
    500                 <div class="t6">凤梨酥</div>
    501             </div>
    502         </div>
    503         <!-- 主体六大图结束 -->
    504         <div class="d4">
    505             <a class="shangyiye">上一页</a>
    506             <a class="shuzi0" >1</a>
    507             <a>
    508                 <img class="shengluehao" src="img/省略号.png" alt="">
    509             </a>
    510             <a>
    511                 <img class="shuzi13" src="img/13.png" alt="">
    512             </a>
    513             <a class="shuzi14">14</a>
    514             <a>
    515                 <img class="shengluehao1" src="img/省略号.png" alt="">
    516             </a>
    517             <a class="shuzi40">40</a>
    518             <a class="xiayiye">下一页</a>
    519         </div>
    520         <!-- 底部信息栏 -->
    521         <div class="d5">
    522             <div class="d6">
    523                 <ul class="l1"><!-- 第一列 -->
    524                     <li class="guanyu">关于遛弯</li>
    525                     <li>公司简介</li>
    526                     <li>联系我们</li>
    527                     <li>诚聘英才</li>
    528                     <li>网站地图</li>
    529                 </ul>
    530                 <ul class="l2"><!-- 第二列 -->
    531                     <li class="bangzhu">帮助中心</li>
    532                     <li>赴台手续</li>
    533                     <li>遛弯玩法</li>
    534                     <li>常见问题</li>
    535                 </ul>
    536                 <ul class="l3"><!-- 第三列 -->
    537                     <li class="wangzhan" >网站条款</li>
    538                     <li>服务条款</li>
    539                     <li>免责声明</li>
    540                 </ul>
    541                 <ul class="l4"><!-- 第四列 -->
    542                     <li class="guanzhu">关注我们</li>
    543                     <li><img class="logo" src="img/双logo.png" alt=""></li>
    544                 </ul>
    545                 <ul class="l5"> <!-- 第五列 -->
    546                     <li class="dianhua1" >400 820 8820</li>
    547                     <li class="riqi">周一至周日</li>
    548                     <li>9:00~20:00</li>
    549                     <li><img class="zaixianfuwuzixun" src="img/在线服务.png" alt=""></li>
    550                 </ul>
    551             </div>
    552         </div>
    553         <div class="d7">
    554             Copyright © 2013-2014 www.6waner.cn All Right Reserved. 京ICP备11015236号
    555         </div>
    556 </body>
    557 </html>
  • 相关阅读:
    将Excel嵌入你的.Net程序
    调用资源文件
    Socket Error# Description
    LPCTSTR 和其它
    linux send and recv详解
    stdafx.h的作用
    setsocketopt() usage
    openfire源码入门级分析
    openfire分析
    关于xmpp
  • 原文地址:https://www.cnblogs.com/yoyoyoyoyoyo/p/5671328.html
Copyright © 2011-2022 走看看