代码实现
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>首页</title>
<style>
#bodydiv {
border: solid 1px blue;
width: 90% px;
}
.logodiv {
border: solid 1px blue;
width: 33%;
float: left;
height: 48px;
}
.clear {
clear: both;
}
.cd {
background-color: black;
height: 30px;
}
.cd a {
font-size: 20px;
color: red;
}
.zs {
width: 100%;
}
.rm {
border: solid 1px blue;
width: 100% px;
}
.rm font {
font-size: 25px;
color: green;
}
.sp {
border: solid 1px blue;
width: 100% px;
float: left;
}
</style>
</head>
<body>
<div id="bodydiv">
<div class=""></div>
<div>
<img alt="" src="../imag/head1.png" class="logodiv">
</div>
<div>
<img alt="" src="../imag/head2.png" class="logodiv">
</div>
<div class="logodiv">
<a href="#">登陆</a> <a href="zhuce.html">注册</a> <a href="#">购物车</a>
</div>
<div class="clear"></div>
<div class="cd">
<a href="shouyediv.html">首页</a> <a href="#">手机数码</a> <a href="#">电脑办公</a>
<a href="#">研烟酒箱包</a>
</div>
<div class="zs">
<img alt="" src="../imag/dianzi.png" width="100%">
</div>
<div class="rm">
<b><font>热门商品</font>
</b><img alt="" src="../imag/sign.png">
</div>
</div>
<div>
<div style="float: left; width: 15%; height: 460px">
<img alt="" src="../imag/11.png" width=100% height=100%>
</div>
<div style="float: left; width: 84%; height: 460px">
<div
style="float: left; width: 100%; border: 1px black solid; height: 50%">
<div style="float: left; width: 39%; height: 100%;">
<img alt="" src="../imag/12.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/13.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
</div>
<div
style="float: left; width: 100%; border: 1px black solid; height: 49%">
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/14.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/13.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
<div style="float: left; width: 19%; height: 100%;">
<img alt="" src="../imag/13.png" width=100% height=100%>
</div>
</div>
</div>
</div>
<div style="width: 100%">
<img alt="" src="../imag/ad.png" width="100%">
</div>
<div class="zs">
<img alt="" src="../imag/dianzi.png" width="100%">
</div>
<div class="rm">
<b><font>最新商品</font>
</b><img alt="" src="../imag/sign.png">
</div>
</div>
<div>
<div style="float: left; width: 15%; height: 460px">
<img alt="" src="../imag/11.png" width=100% height=100%>
</div>
<div style="float: left; width: 84%; height: 460px">
<div
style="float: left; width: 100%; border: 1px black solid; height: 50%">
<div style="float: left; width: 39%; height: 100%;">
<img alt="" src="../imag/12.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/13.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
</div>
<div
style="float: left; width: 100%; border: 1px black solid; height: 49%">
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/14.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/13.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
<div style="float: left; width: 20%; height: 100%;">
<img alt="" src="../imag/15.png" width=100% height=100%>
</div>
<div style="float: left; width: 19%; height: 100%;">
<img alt="" src="../imag/13.png" width=100% height=100%>
</div>
</div>
</div>
</div>
<div>
<img alt="" src="../imag/q.png" width="100%">
</div>
<div style="text-align: center;">
<a href="html.html">关于我们</a> 公司简介 招贤纳士 广告服务 联系方式 合作伙伴 论坛反馈<br>版权声明:Copyright
© 1999-2016,赵瑾的网站 , All Rights Reserved
</div>
</body>
</html>