淘宝女装分类页面 

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title>淘宝女装分类页面</title>
 6     <link href="css/本章作业5.css" rel="stylesheet" type="text/css"/>
 7 </head>
 8 <body>
 9 <ul>
10     <li>夏季流行<hr/></li>
11     <li><a href="">夏季新品</a>  <a href="">雪纺裙</a> <a href="">短袖T</a> <a href="">铅笔裤</a> <a href="">短裤</a> <a href="">短袖衬衫</a> <a href="">小脚牛仔裤</a> <a href="">开衫</a> <a href="">蕾丝/雪纺衫</a> <a href="">韩版外套</a> <a href="">小西装</a> <a href="">中长款裙</a></li>
12     <li>上装<hr/></li>
13     <li><a href="">T恤</a> <a href="">衬衫</a> <a href="">针织衫</a> <a href="">长袖T</a> <a href="">韩版T</a> <a href="">情侣衫</a> <a href="">雪纺衬衫</a> <a href="">韩版衬衫</a> <a href="">防晒衣</a> <a href="">休闲套装</a> <a href="">卫衣</a> <a href="">背心/吊带</a></li>
14     <li>裙子<hr/></li>
15     <li><a href="">连衣裙</a> <a href="">半身裙</a> <a href="">长裙</a> <a href="">短袖裙</a> <a href="">蕾丝连衣裙</a> <a href="">长袖裙</a> <a href="">无袖/背心裙</a> <a href="">A字裙</a> <a href="">牛仔裙</a> <a href="">半身中长裙</a> <a href="">半身短裙</a> <a href="">包臀裙</a></li>
16     <li>裤子<hr/></li>
17     <li><a href="">裤子</a> <a href="">休闲裤</a> <a href="">牛仔裤</a> <a href="">打底裤</a> <a href="">长裤</a> <a href="">哈伦裤</a> <a href="">阔腿裤</a> <a href="">短裤/热裤</a> <a href="">连体裤</a> <a href="">七/九分裤</a> <a href="">牛仔短裤</a> <a href="">西装裤</a></li>
18     <li>其他女装<hr/></li>
19     <li><a href="">胖M装</a> <a href="">中老年</a> <a href="">婚纱</a> <a href="">礼服</a> <a href="">旗袍</a> <a href="">夜店</a> <a href="">舞台装</a> <a href="">唐装</a> <a href="">职业装</a> <a href="">全球购</a> <a href="">羊绒衫</a> <a href="">毛衣</a> <a href="">呢大衣</a> <a href="">羽绒服</a> <a href="">真皮皮衣</a></li>
20 </ul>
21 </body>
22 </html>
23 li{
24     list-style: none;
25 }
26 li:nth-child(odd){
27     text-indent:2.5em;
28     font-size: 18px;
29     font-weight: bold;
30     line-height: 3;
31 }
32 li:nth-child(even){
33     font-size: 12px;
34     line-height: 2;
35 }
36 li:nth-of-type(1){
37     background: url("../image/dress01.png") no-repeat 0 8px;
38 }
39 li:nth-of-type(3){
40     background: url("../image/dress02.png") no-repeat 0 8px;
41 }
42 li:nth-of-type(5){
43     background: url("../image/dress03.png") no-repeat 0 8px;
44 }
45 li:nth-of-type(7){
46     background: url("../image/dress04.png") no-repeat 0 8px;
47 }
48 li:nth-of-type(9){
49     background: url("../image/dress05.png") no-repeat 0 8px;
50 }
51 a{
52     text-decoration: none;
53     color: black;
54 }
55 a:hover{
56      text-decoration: underline;
57      color: #F60;
58 }

 

posted @ 2021-01-20 09:12  残冰辉  阅读(1001)  评论(0)    收藏  举报