四种CSS链接按钮示例

背景色切换链接按钮CSS代码：
/**//*2008.10.08*/

#linkButtonDiv1 ul{}{
    margin:0;
    padding:0;
    list-style-type:none;
}

#linkButtonDiv1 li a{}{
    width:100px;
    height:20px;
   
    display:bolck;   
    font-size: 16px;
       
    margin:5px;
   
    border: 1px solid #000000;
   
    padding:5px;
   
    color:#000000;
    background-color:#94b8e9;
    text-decoration:none;
    text-align:center;
}

#linkButtonDiv1 li a:hover{}{
    color:#ffffff;
    background-color:#336699;
    text-decoration:underline;
}

背景图片切换链接按钮CSS代码：
/**//*2008.10.08*/

#linkButtonDiv2 ul{}{
    margin:0;
    padding:0;
    list-style-type:none;
}

#linkButtonDiv2 li a{}{
    width:100px;
    height:20px;
   
    display:bolck;   
    font-size: 16px;
       
    margin:5px;
   
    border: 1px solid #000000;
   
    padding:5px;
   
    color:#000000;
    background:url(../img/bg-0314.gif);
    text-decoration:none;
    text-align:center;
}

#linkButtonDiv2 li a:hover{}{
    color:#ffffff;
    background:url(../img/bg-0315.gif);
    text-decoration:underline;
}

背景色突起效果按钮示例：
/**//*2008.10.08*/

#linkButtonDiv3 ul{}{
    margin:0;
    padding:0;
    list-style-type:none;
}

#linkButtonDiv3 li a{}{
    width:100px;
    height:20px;
   
    display:bolck;   
    font-size: 16px;
       
    margin:5px;
   
    padding:5px;
   
    color:#8d4f10;
    background:#efb57c;
   
    text-decoration:none;
    text-align:center;
   
    border:2px outset #efb57c;
}

#linkButtonDiv3 li a:hover{}{
    font-weight:bold;
    color:#ffffff;
    background:#daa670;
    text-decoration:underline;
   
    border:2px outset #daa670;
}

一张背景图片左右切换按钮CSS代码：
/**//*2008.10.08*/

#linkButtonDiv4 ul{}{
    margin:0;
    padding:0;
    list-style-type:none;
}

#linkButtonDiv4 li a{}{
    width:114px;
    h

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢!