Como cambiar los colores de botones con links

[DiegoEscobar]

Buenas noches a todos.

Mi duda es la siguiente, en mi página web tengo una parte donde hay botones con hipervinculos diferentes cada uno y lo que quiero es que si un boton ya fue visitado por el usuario se cambie de color totalmente y no solo el color de la letra. ¿Como puedo hacer esto? Lo he estado intentando con css pero lo unico que logro es que cambie el color de la letra y no el fondo del boton.

Código PHP:

  #btnlyo:link {
    font-family: sans-serif;
    font-size: 13px;
    color: #FFFFFF;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: 0 0;}
    
#btnlyo:visited {
    font-family: sans-serif;
    font-size: 13px;
    color: #7118D3;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: -31px -31px;}
 
 #btnlyo:hover {
    font-family: sans-serif;
    font-size: 13px;
    color: #FFFFFF;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: 0 -31px;}
 
#btnlyo:active {    font-family: sans-serif;
    font-size: 13px;
    color: #FFFFFF;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: 0 -31px;} 
   

[caricatos]

Hola:

El estilo que define el color de fondo de los elementos de texto es background-color, pero si ese color se lo das por medio de una imagen, lo que debes hacer es cambiar la imagen...

Saludos

[Ferdinand1945]

A ver, proba asi:

Código:

#btnlyo:link {
    font-family: sans-serif;
    background-color:#787878; 
    font-size: 13px;
    color: #FFFFFF;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: 0 0;}
    
#btnlyo:visited {
    font-family: sans-serif;
    background-color:#339966;
    font-size: 13px;
    color: #7118D3;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: -31px -31px;}

 #btnlyo:hover {
    font-family: sans-serif;
    background-color:#C8C8C8;
    font-size: 13px;
    color: #FFFFFF;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: 0 -31px;}

#btnlyo:active {    font-family: sans-serif;
    font-size: 13px;
    color: #FFFFFF;
    text-decoration: none;
    height: 31px;
    width: 120px;
    padding: 8px 38px;
    background-image: url(../img/oth/btn_loy.png);
    background-repeat: no-repeat;
    background-position: 0 -31px;}

De ahi ya le pones los colores que quieras cambiando el background-color: de cada uno de los btnlyo declarados ahi. Suerte