道空HTML作业2 - 已锁定
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>鲜花网</title>
<style type="text/css">
* {
margin:0;
padding:0;
}
ul li {
list-style:none;
}
a {
text-decoration:none;
}
#bigdiv {
margin:0 auto;
width:1024px;
background-color:#fff;
}
#bigdiv #head img {
width:100%;
}
#bigdiv #top ul li {
float:left;
padding:0 41px;
height:33px;
line-height:33px;
background-repeat:no-repeat;/*背景不平铺*/
background-size:100%;/*背景大小*/
background-image:url("images/button1.jpg");/*背景图片*/
}
#bigdiv #top ul li:hover {
float:left;
padding:0 41px;
height:33px;
line-height:33px;
background-repeat:no-repeat;/*背景不平铺*/
background-size:100%;/*背景大小*/
background-image:url("images/button1_bg.jpg");/*背景图片*/
}
a {
color:#040404;
}
#hg {
width:1024px;
height:500px;
}
#bigdiv #iii {
width:220px;
height:500px;
float:left;
}
#bigdiv #uuu {
width:800px;
height:500px;
float:left;
}
#iii h3 {
display:inline-block;
line-height:30px;
height:30px;
width:200px;
background-color:#ffced1;
margin-left:10px;
}
.ooo {
width:220px;
}
#iii ul li img {
margin:0 15px;
}
#iii ul li {
margin-left:36px;
line-height:15px;
margin-top:2px;
}
.ty {
width:800px;
}
#uuu dl dd {
text-align:center;
}
#uuu dl {
float:left;
margin:10px 25px;
}
.yu {
width:150px;
}
.yyu:hover {
color:#07cae5;
}
.rrr:hover {
color:#ff6a00;
}
p {
text-align:center;
}
#tt {
background-color:#ffced1;
}
</style>
</head>
<body>
<div id="tt">
<div id="bigdiv">
<div id="head"><img src="images/banner.jpg" /></div>
<div id="top">
<ul>
<li><a href="#">鲜花礼品</a></li>
<li><a href="#">鲜花礼品</a></li>
<li><a href="#">鲜花礼品</a></li>
<li><a href="#">鲜花礼品</a></li>
<li><a href="#">鲜花礼品</a></li>
<li><a href="#">鲜花礼品</a></li>
<li><a href="#">鲜花礼品</a></li>
<div style="clear:both"></div>
</ul>
</div>
<div id="hg">
<div id="iii"><img src="images/category.jpg" class="ooo" />
<h3>用途</h3>
<ul>
<li><img src="images/icon1.gif" /><a href="#" class="yyu">爱情鲜花</a></li>-------------------------------
<li><img src="images/icon1.gif" /><a href="#" class="yyu">生日送花</a></li>-------------------------------
<li><img src="images/icon1.gif" /><a href="#" class="yyu">新年鲜花</a></li>-------------------------------
<li><img src="images/icon1.gif" /><a href="#" class="yyu">家庭用花</a></li>-------------------------------
<li><img src="images/icon1.gif" /><a href="#" class="yyu">亲情用花</a></li>-------------------------------
<li><img src="images/icon1.gif" /><a href="#" class="yyu">道歉鲜花</a></li>-------------------------------
<li><img src="images/icon1.gif" /><a href="#" class="yyu">开业花篮</a></li>-------------------------------
<li><img src="images/icon1.gif" /><a href="#" class="yyu">会议用花</a></li>-------------------------------
</ul>
</div>
<div id="uuu"><img src="images/recommend.jpg" class="ty"/>
<dl>
<dt><a href="#"><img src="images/flower1.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
<dl>
<dt><a href="#"><img src="images/flower2.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
<dl>
<dt><a href="#"><img src="images/flower3.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
<dl>
<dt><a href="#"><img src="images/flower4.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
<dl>
<dt><a href="#"><img src="images/flower5.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
<dl>
<dt><a href="#"><img src="images/flower6.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
<dl>
<dt><a href="#"><img src="images/flower7.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
<dl>
<dt><a href="#"><img src="images/flower8.jpg" class="yu" /></a></dt>
<dd><a href="#" class="rrr">幸福的味道<br />￥228元</a></dd>
</dl>
</div>
</div>
</div>
<br />
<p>
《中华人名共和国国际市场服务业经营许可证》编号：京ICP证000000号
<br />Copyright © 2014满屋花|中文（简体）WWW.XXX.cn
</p>
</div>
</body>
</html>
打赏我,让我更有动力~
返回首页
CTF&WP专版
Track-方丈
发表于 2018-7-2
通过。
评论列表
加载数据中...