ASCII码 ASCII码

侧边栏作业

发布于:2022-05-11 16:23:13  栏目:技术文档

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>侧边栏</title>
  7. <style>
  8. *{
  9. padding: 0px;
  10. }
  11. div{
  12. width: 180px;
  13. height: 420px;
  14. margin:auto;
  15. }
  16. ul>li{
  17. display: block;
  18. width: 165px;
  19. height: 25px;
  20. /* border:1px solid #000; */
  21. padding-left: 15px;
  22. color: rgb(30,30,30);
  23. }
  24. ul>li>a{
  25. display: inline-block;
  26. text-decoration: none;
  27. color: rgb(30,30,30);
  28. font-size: 13px;
  29. }
  30. ul>li:hover{
  31. background: rgb(217,217,217);
  32. color: rgb(203,53,59);
  33. }
  34. ul>li>a:hover{
  35. background: rgb(217,217,217);
  36. color: rgb(203,53,59);
  37. }
  38. </style>
  39. </head>
  40. <body>
  41. <div>
  42. <ul>
  43. <li><a href="#">家用电器</a></li>
  44. <li><a href="#">手机/</a><a href="#">运营商/</a><a href="#">数码</a></li>
  45. <li><a href="#">电脑/</a><a href="#">办公</a></li>
  46. <li><a href="#">家居/</a><a href="#">家具/</a><a href="#">家装/</a><a href="#">厨具</a></li>
  47. <li><a href="#">男装/</a><a href="#">女装/</a><a href="#">童装/</a><a href="#">内衣</a></li>
  48. <li><a href="#">美妆/</a><a href="#">个护清洁/</a><a href="#">宠物</a></li>
  49. <li><a href="#">女鞋/</a><a href="#">箱包/</a><a href="#">钟表/</a><a href="#">珠宝</a></li>
  50. <li><a href="#">男鞋/</a><a href="#">运动/</a><a href="#">户外</a></li>
  51. <li><a href="#">房产/</a><a href="#">汽车/</a><a href="#">汽车用品</a></li>
  52. <li><a href="#">母婴/</a><a href="#">玩具乐器</a></li>
  53. <li><a href="#">食品/</a><a href="#">酒类/</a><a href="#">生鲜/</a><a href="#">特产</a></li>
  54. <li><a href="#">艺术/</a><a href="#">礼品鲜花/</a><a href="#">农资绿植</a></li>
  55. <li><a href="#">医药保健/</a><a href="#">计生情趣</a></li>
  56. <li><a href="#">图书/</a><a href="#">文娱/</a><a href="#">教育/</a><a href="#">电子书</a></li>
  57. <li><a href="#">机票/</a><a href="#">酒店/</a><a href="#">旅游/</a><a href="#">生活</a></li>
  58. <li><a href="#">理财/</a><a href="#">众筹/</a><a href="#">白条/</a><a href="#">保险</a></li>
  59. <li><a href="#">安装/</a><a href="#">维修/</a><a href="#">清洗/</a><a href="#">二手</a></li>
  60. <li><a href="#">工业品</a></li>
  61. </ul>
  62. </div>
  63. </body>
  64. </html>
相关推荐
阅读 +