HTML第六章课后作业4

来源：互联网发布：淘宝直播个人自我介绍编辑：程序博客网时间：2024/05/21 08:46

<!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"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>商品分类列表页</title><link href="123.css" rel="stylesheet" type="text/css" /></head><body><div id="product">  <ul>    <li class="list01"><a href="#">酒水、饮料</a></li>    <li class="list02"><a href="#">进口食品</a></li>    <li class="list03"><a href="#">休闲零食</a></li>    <li class="list04"><a href="#">地方特产</a></li>    <li class="list05"><a href="#">保健、冲调</a></li>    <li class="list06"><a href="#">粮油、生鲜</a></li>    <li class="list07"><a href="#">美容洗护</a></li>    <li class="list08"><a href="#">清洁洗涤</a></li>    <li class="list09"><a href="#">母婴、纸品</a></li>    <li class="list10"><a href="#">家居百货</a></li>  </ul></div></body></html>

@charset "gb2312";/* CSS Document */ul, li {padding:0px;margin:0px;}li {list-style-type:none;}#product {width:200px;border:2px #fc9829 solid;}#product ul {width:190px;margin:0px auto;}#product li {height:47px;font-size:12px;font-weight:bold;padding-left:50px;border-bottom:1px #929292 dotted;line-height:47px;}#product li a{text-decoration:none; color:#000;}#product li a:hover{text-decoration:none; color:#CC5A0F;}#product .list01 {background:url(icon_01.jpg) 0px 0px no-repeat;}#product .list02 {background:url(icon_02.jpg) 0px 0px no-repeat;}#product .list03 {background:url(icon_03.jpg) 0px 0px no-repeat;}#product .list04 {background:url(icon_04.jpg) 0px 0px no-repeat;}#product .list05 {background:url(icon_05.jpg) 0px 0px no-repeat;}#product .list06 {background:url(icon_06.jpg) 0px 0px no-repeat;}#product .list07 {background:url(icon_07.jpg) 0px 0px no-repeat;}#product .list08 {background:url(icon_08.jpg) 0px 0px no-repeat;}#product .list09{background:url(icon_09.jpg) 0px 0px no-repeat;}#product .list10 {background:url(icon_10.jpg) 0px 0px no-repeat;}

0 0