超链接与背景简单设置

a:link 超链接的普通样式，即正常浏览样式

a:visited 被点击过的超链接样式

a:hover 鼠标指针经过超链接的样式

a:active 在超链接上单击时，即“当前激活”时，超链接的样式

 

例1

<style>

a:link,a:visited{

       text-decoration:none;     /*原样式与点击后样式无下划线*/

}

a:hover,a:active{

       text-decoration:underline;      /*鼠标经过与单击时有下划线*/

}

</style>

 

例2 背景立体阴影效果

设置字体、颜色、大小、边距等

表框色，原样式与点击后样式上左白灰色，右下黑灰色；鼠标经过与单击时上左黑灰色，右下白灰色。

<style>

a{

       font-family:Arial, Helvetica, sans-serif;

       font-size:0.8em;

       text-align:center;

       margin:5px;

}

a:link,a:visited{

       color:#333;

       padding:4px 10px 4px 10px;

       background-color:#6CF;

       text-decoration:none;

       border-top:1px solid #eee;

       border-left:1px solid #eee;

       border-bottom:1px solid #717171;

       border-right:1px solid #717171; 

}

a:hover,a:active{

       padding:3px 8px 3px 8px;

       background-color:#69F;

       border-top:1px solid #717171;

       border-left:1px solid #717171;

       border-bottom:1px solid #eee;

       border-right:1px solid #eee;

}

</style>

转载于:https://www.cnblogs.com/yo-yo/archive/2011/09/26/2191260.html