其他分享
首页 > 其他分享> > 网页设计

网页设计

作者:互联网

https://gitee.com/wenxiulian/codes/u0vhs482xtwglq36dpjmc32

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- InstanceBegin template="/Templates/muban.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>首页</title>
<style>
<!--内容开始-->
.picturediv {
    margin: 50px;
    margin: 0 auto;
}
.leftdiv {
    width: 190px;
    height: 300px;
}
.nr {
    width: 1400px;
    height: auto;
    margin: 0 auto;
}
.xia {
    text-align: center;
}
#shijia {
    display: block;
    color: #FFF;
    font-size: 14px;
    font-weight: 600;
    font-family: "??????";
}
#shijia:hover {
    color: #CCC;
}
<!--结束-->
</style>
<!-- InstanceEndEditable -->
<link rel="shortcut icon" type="image/x-icon" href="images/LOGO_32X32.ico" />
<link href="css/sucaijiayuan.css" rel="stylesheet" type="text/css" />
<script src="js/jquery.min.js"></script>
<script src="js/sucaijiayuan.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css" media="screen" />
<script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.banner.revolution.min.js"></script>
<script type="text/javascript" src="js/banner.js"></script>

<!--内容css开始-->
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/demo.css" />
<link rel="stylesheet" type="text/css" href="css/component.css" />

<!--结束-->

</head>

<body>
<div class="nr">
<!--导航开始-->
<div class="toubu1" >
  <div class="toubu" >
    <ul id="daohang">
      <li><a href="index.html" target="_self"><img src="images/logo_rings(1).png" /></a></li>
      <li><a href="index.html" target="_self">首页</a></li>
      <li><a href="zuixinchekuan.html" target="_self">最新车款</a></li>
      <li><a href="chuangxinkeji.html" target="_self">创新科技</a></li>
      <li><a href="sirendingzhi.html" target="_self">私人订制</a></li>
      <li><a href="ershouzhuanmai.html" target="_self">二手转卖</a></li>
      <li><a href="guanyuwomen.html" target="_self">关于我们</a></li>
      <li><a href="liuyanjianyi.html" target="_self">留言建议</a></li>
    </ul>
  </div>
</div>
<!--导航结束--> 
<!-- InstanceBeginEditable name="xin" --> 
<!--开始-->
<div id="wrapper">
  <div class="fullwidthbanner-container">
    <div class="fullwidthbanner">
      <ul>
        <li data-transition="3dcurtain-horizontal" data-slotamount="15" data-masterspeed="300" data-link="zuixinchekuan.html"> <img src="images/lunbo1.jpg" alt="" /> </li>
        <li data-transition="3dcurtain-vertical" data-slotamount="15" data-masterspeed="300" data-link="zuixinchekuan.html"><img src="images/lunbo2.jpg" alt="" /> </li>
        <li data-transition="papercut" data-slotamount="15" data-masterspeed="300" data-link="zuixinchekuan.html"> <img src="images/lunbo3.jpg" alt="" /> </li>
        <li data-transition="turnoff" data-slotamount="15" data-masterspeed="300" data-link="ershouzhuanmai.html"> <img src="images/lunbo4.jpg" alt="" /> </li>
        <li data-transition="flyin" data-slotamount="15" data-masterspeed="300" data-link="#"> <img src="images/lunbo5.jpg" alt="" /> </li>
      </ul>
    </div>
  </div>
</div>
<!--结束--> 

<!---->
<div id="zhuti-sy"> 
  
  <!-- 开始 -->
  <div class="sygrid">
    <div class="grid">
      <figure class="effect-chico"> <img src="images/aodia9.png" alt="img15"/>
        <figcaption>
          <h2 style="color:#FFF;">奥迪A9<span style="color:#FFF;">创新科技</span></h2>
          <p style="color:#FFF;">A9 不仅仅是汽车</p>
          <a href="chuangxinkeji.html" target="_self"></a> </figcaption>
      </figure>
      <figure class="effect-chico"> <img src="images/aodia8.png" alt="img15"/>
        <figcaption>
          <h2 style="color:#FFF;">奥迪A8L<span style="color:#FFF;">最新车款</span></h2>
          <p style="color:#FFF;">引领权贵 再度像未来进发</p>
          <a href="zuixinchekuan.html" target="_self"></a> </figcaption>
      </figure>
      <figure class="effect-chico"> <img src="images/aodia6.png" alt="img15"/>
        <figcaption>
          <h2 style="color:#FFF;">奥迪A6<span style="color:#FFF;">最新车款</span></h2>
          <p style="color:#FFF;">让你的心底腾起驾驶欲望</p>
          <a href="zuixinchekuan.html" target="_self"></a> </figcaption>
      </figure>
      <figure class="effect-chico"> <img src="images/aodia5.png" alt="img15"/>
        <figcaption>
          <h2 style="color:#FFF;">奥迪A5<span style="color:#FFF;">最新车款</span></h2>
          <p style="color:#FFF;">开启驾驶乐趣新篇章</p>
          <a href="zuixinchekuan.html" target="_self"></a></figcaption>
      </figure>
    </div>
  </div>
  <!-- 结束 --> 
  
 <!--开始-->
  
  <div class="bigdiv">
  <div style="padding:4px"><img src="images/syxwLOGO.png" /></div>
           <div style="background-image:url(images/homepage-testdrive.jpg);  height:526px; padding-top:30px; padding-left:30px;">
       <a href="yuyueshijia.html" id="shijia" >预约驾驶></a></div>
     </div>
</div>
</div>
<!--结束--> 

<!--开始-->
<div class="tubiao">
  <ul>
    <li><a href="gouchedaohang (1).html"><img src="images/tubiao/购车导航.png" /><br />
      <br />
      <span>车辆导购</span></a></li>
    <li><a href="yuyueshijia.html" target="_blank"><img src="images/tubiao/预约试驾.png" /><br />
      <br />
      <span>预约驾驶</span></a></li>
    <li><a href="zuixinchekuan.html"><img src="images/tubiao/最新车款.png" /><br />
      <br />
      <span>索取车型手册</span></a></li>
    <li><a href="zuixinchekuan.html"><img src="images/tubiao/最新车款.png" /><br />
      <br />
      <span>查询新车</span></a></li>
    <li><a href="ershouzhuanmai.html"><img src="images/tubiao/二手转卖.png" /><br />
      <br />
      <span>查询二手车</span></a></li>
  </ul>
</div
      
      
      >
<!-- InstanceEndEditable -->
</div>
<!--内容结束-->
<div class="dibu">
  <hr width="1200px;" />
  <a href="index.html" target="_self">首页</a>?<a href="zuixinchekuan.html" target="_self">最新车款</a>?<a href="chuangxinkeji.html" target="_self">创新科技</a>?<a href="sirendingzhi.html" target="_self">?私人订制</a>?<a href="ershouzhuanmai.html" target="_self">二手转卖</a>?<a href="guanyuwomen.html" target="_self">关于我们</a>?<a href="liuyanjianyi.html" target="_self">留言建议</a><br />
  青海大学计算机系丨版权所有丨Copyright &copy; All right reserved.<br />
  地址:青海省西宁市xxxxx&nbsp;&nbsp;&nbsp;联系电话:18888888888  &nbsp;豫ICP备66666666号-8  </div>
<a href="#0" class="cd-top">Top</a>
</body>
<!-- InstanceEnd -->
</html>

 

标签:网页,奥迪,auto,车款,nbsp,设计,font,margin
来源: https://www.cnblogs.com/wenxiulian/p/10629144.html