zoukankan      html  css  js  c++  java
  • [div+css]竖排菜单

     1 <!doctype html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>Menu</title>
     6     <style>
     7         
     8         body{
     9             background-color: #ffded0;
    10         }
    11         #box{
    12             width:120px;
    13             font-size: 12px;
    14             font-family: "宋体";
    15         }
    16         #box ul{
    17             margin:0px;
    18             padding:0px;
    19             list-style-type: none;
    20         }
    21         #box li{
    22             border-bottom: #ed9f9f solid 1px;
    23 
    24         }
    25         #box li a{
    26             display: block;
    27             padding: 5px 5px 5px 8px;
    28             text-decoration: none;
    29             border-left: 12px solid #711515;
    30             border-right: 1px solid #711515;
    31         }
    32         /*动态菜单的效果*/
    33         #box li a:link{
    34             background-color: #c11136;
    35             color:#ffffff;
    36         }
    37         #box li a:visited{
    38             background-color: #c11136;
    39             color:#ffffff;
    40         }
    41         #box li a:hover{
    42             background-color: #990020;
    43             color:#ffff00;
    44         }
    45     </style>
    46 </head>
    47 <body>
    48     <div id="box">
    49         <ul>
    50             <li><href="#">首页</a></li>
    51             <li><href="#">音乐MP3</a></li>
    52             <li><href="#">个人相册</a></li>
    53             <li><href="#">我的博客</a></li>
    54             <li><href="#">我的空间</a></li>
    55         </ul>
    56     </div>
    57 </body>
    58 </html>
  • 相关阅读:
    bootstrap
    前端框架 angularjs
    JAva集合框架
    圣诞
    IDEA
    科目三
    Bootstrap简介及Bootstrap里的栅格系统col-md/sm/xs-x;
    C# Windows service 定时发邮件功能 (用到webService)
    <转> 数据库索引的作用和优点缺点
    小知识
  • 原文地址:https://www.cnblogs.com/lizunicon/p/4179904.html
Copyright © 2011-2022 走看看