Otimizar CSS

[mkboy 1]

Tem como otimizar esse bloco!

No caso estou personalizando o link do titulo do produto, detalhes, e do preço.

 

.produtos_departamentos:link  { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:10px; color: #999999;}
.produtos_departamentos:visited { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:10px; color: #999999; } 
.produtos_departamentos:active { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:10px; color: #999999;}
.produtos_departamentos:hover { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:10px; color: #A1D011;}

.produtos_destaque_titulo:link  { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:11px; color: #666666;}
.produtos_destaque_titulo:visited { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:11px; color: #666666; } 
.produtos_destaque_titulo:active { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:11px; color: #666666;}
.produtos_destaque_titulo:hover { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:bold; font-size:11px; color: #A1D011;}

.produtos_destaque_descricao:link  { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666;}
.produtos_destaque_descricao:visited { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666; } 
.produtos_destaque_descricao:active { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666;}
.produtos_destaque_descricao:hover { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #A1D011;}

.produtos_destaque_preco:link  { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666;}
.produtos_destaque_preco:visited { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666; } 
.produtos_destaque_preco:active { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666;}
.produtos_destaque_preco:hover { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #A1D011;}

.produtos_destaque_promocao:link  { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #FF6F0F;}
.produtos_destaque_promocao:visited { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666; } 
.produtos_destaque_promocao:active { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666;}
.produtos_destaque_promocao:hover { text-decoration: none; padding-left: 5px; font-family: Verdana; font-weight:normal; font-size:11px; color: #666666;}

[William Bruno 1501]

você poderia "juntar" as formatações iguais, e depois só setar as diferentes(no caso, a cor do hover):

 

.produtos_departamentos:link, .produtos_departamentos:visited , .produtos_departamentos:active, .produtos_departamentos:hover   {
 text-decoration: none; 
 padding-left: 5px; 
 font-family: Verdana; 
 font-weight:bold; 
 font-size:10px; 
 color: #999;
}
.produtos_departamentos:hover {
 color: #A1D011;

Ou então, fazer isso na DIV em que estão esses links, que eu acho que seria mais "correto":

#produtos_departamentos a:link, #produtos_departamentos a:visited, #produtos_departamentos a:active, #produtos_departamentos a:hover{
 text-decoration: none; 
 padding-left: 5px; 
 font-family: Verdana; 
 font-weight:bold; 
 font-size:10px; 
 color: #999;
}
#produtos_departamentos:hover {
 color: #A1D011;

você está colocando um span em cada link? Se for isso, realmente estilizando a DIV onde eles estão, você economiza muito mais código.

 

E depois, agindo assim com todos os outros blocos.

[mkboy 1]

Opa... legal... isso vai poupar trocentas linhas do meu css.. hehe ..valeu

 

Estou fazendo no link.. tipo

 

<a href="#" class="produtos_departamentos">link</a>