摘要：<!DOCTYPE><html> <head> <meta charset="utf-8"> <title>css中的浮动的作业</title> <style> *{padding:0px; margin:0px;} .daohang1{list-styl
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<title>css中的浮动的作业</title>
<style>
*{padding:0px; margin:0px;}
.daohang1{list-style:none; width:100px; height:40px; line-height:40px; text-align:center; margin:1px; float:left;box-shadow:0px 10px 30px pink inset; border-radius:6px; position:relative; z-index:100}
.daohang2{list-style:none; width:100px; height:40px; background:pink; line-height:40px; text-align:center; margin:1px; display:none; position:relative; z-index:100}
.daohang1:hover .daohang2{display:block;}
.clear{clear:both;}
p{display:inline-block; color:red; margin:15px;}
.box1{width:320px; height:320px; background-image:url(images/niurou.jpg); position:relative;}
.box2{width:27px; height:19px; background-image:url(images/hot.gif); position:absolute; top:0px; right:0px;}
</style>
</head>
<body>
<ul>
<li class="daohang1">肉类
<ul>
<li class="daohang2">牛肉</li>
<li class="daohang2">羊肉</li>
<li class="daohang2">猪肉</li>
</ul>
</li>
<li class="daohang1">蔬菜
<ul>
<li class="daohang2">黄瓜</li>
<li class="daohang2">番茄</li>
<li class="daohang2">萝卜</li>
</ul>
</li>
<li class="daohang1">饮料
<ul>
<li class="daohang2">苹果汁</li>
<li class="daohang2">牛奶</li>
<li class="daohang2">酸奶</li>
</ul>
</li>
</ul>
<div class="clear"></div>
<p>本店特色</p><b>酱牛肉</b>
<div class="box1">
<div class="box2"></div>
</div>
</body>
</html>
批改老师：灭绝师太批改时间：2018-12-03 14:19:55
老师总结：效果基本实现了，颜色搭配的不好啊，直男审美么？可能是老师吹毛求疵，继续加油！
