Cuatro ejemplos de botones de enlace CSS

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

#linkButtonDiv1 ul{}{
margen:0;
relleno: 0;
tipo de estilo de lista: ninguno;
}

#linkButtonDiv1 li a{}{
ancho: 100 px;
altura: 20 píxeles;

pantalla:bolck;
tamaño de fuente: 16px;

margen: 5px;

borde: 1px sólido #000000;

relleno: 5px;

color:#000000;
color de fondo:#94b8e9;
decoración de texto: ninguna;
alineación de texto:centro;
}

#linkButtonDiv1 li a:hover{}{
color:#ffffff;
color de fondo:#336699;
decoración de texto: subrayado;
}

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

#linkButtonDiv2 ul{}{
margen:0;
relleno: 0;
tipo de estilo de lista: ninguno;
}

#linkButtonDiv2 li a{}{
ancho: 100 px;
altura: 20 píxeles;

pantalla:bolck;
tamaño de fuente: 16px;

margen: 5px;

borde: 1px sólido #000000;

relleno: 5px;

color:#000000;
fondo:url(../img/bg-0314.gif);
decoración de texto: ninguna;
alineación de texto:centro;
}

#linkButtonDiv2 li a:hover{}{
color:#ffffff;
fondo:url(../img/bg-0315.gif);
decoración de texto: subrayado;
}

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

#linkButtonDiv3 ul{}{
margen:0;
relleno: 0;
tipo de estilo de lista: ninguno;
}

#linkButtonDiv3 li a{}{
ancho: 100 px;
altura: 20 píxeles;

pantalla:bolck;
tamaño de fuente: 16px;

margen: 5px;

relleno: 5px;

color:#8d4f10;
antecedentes:#efb57c;

decoración de texto: ninguna;
alineación de texto:centro;

borde: 2px inicio #efb57c;
}

#linkButtonDiv3 li a:hover{}{
peso de fuente: negrita;
color:#ffffff;
antecedentes:#daa670;
decoración de texto: subrayado;

borde: 2px inicio #daa670;
}

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

#linkButtonDiv4 ul{}{
margen:0;
relleno: 0;
tipo de estilo de lista: ninguno;
}

#linkButtonDiv4 li a{}{
ancho: 114 px;
altura: 24px;

pantalla:bolck;
tamaño de fuente: 12px;

margen: 5px;

relleno: 5px;

color:#000000;
fondo:url(../img/buttonbg.jpg) no repetir arriba a la izquierda;
decoración de texto: ninguna;
alineación de texto:centro;
}

#linkButtonDiv4 li a:hover{}{
peso de fuente: negrita;
color:#ffffff;
posición de fondo: arriba derecha;
decoración de texto: subrayado;
}

Versión HTML: