css实现超连接按钮形式显示

浏览数：18 / 时间：2015年06月09日

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>test</title>
<style type="text/css">
#navigation ul {
    list-style: none;
   
}
#navigation li {
   
    padding:2px;
}
   
#navigation a:link, #navigation a:visited { 
    margin-right: 2px;
    padding: 3px 10px 2px 10px; 
    color: #A62020;
    background-color: #FCE6EA;display: block;
    text-decoration: none;
    border-top: 1px solid #FFFFFF;
    border-left: 1px solid #FFFFFF;
    border-bottom: 1px solid #717171;
    border-right: 1px solid #717171;
}
   
#navigation a:hover {
    border-top: 1px solid #717171;
    border-left: 1px solid #717171;
    border-bottom: 1px solid #FFFFFF;
    border-right: 1px solid #FFFFFF;
}
</style>
</head>
<body onload="">
 <div id="navigation">
                <ul>
                    <li><a href="">link1</a></li>
                    <li><a href="">link2</a></li>
                    <li><a href="">link3</a></li>
                    <li><a href="">link4</a></li>
                    <li><a href="">link5</a></li>
                    <li><a href="">link6</a></li>
                </ul></div>
</body>
</html>