网页设计
作者：互联网
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 © All right reserved.<br />
地址：青海省西宁市xxxxx 联系电话：18888888888 豫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