Marcadores do Blog com efeito Hover

Hoje vou mostrar como colocar o efeito "Hover" nos marcadores do blog. Caso você não conheça esse efeito, saiba que ele é executado quando passamos o "Cursor" do mouse sobre uma determinada área de um link ou botão e o fundo muda de cor...





O efeito Hover nos marcadores é bastante simples e fácil de aplicá-lo ao seu blog, então, veja uma breve demonstração dos Marcadores: (DEMONSTRAÇÃO)

Colocando efeito Hover nos marcadores do Blog

Como eu tinha falado, o efeito é bastante simples, nele é utilizado um pequeno código CSS.

Primeiro: Acesse o painel de edição do seu blog.
Vá em Modelos >> Editar HTML

Segundo: Após estar no Editor de HTML do seu blog, Expanda a seguinte Linha "<b:skin>...</b:skin>" que fica logo no começo do código, veja o exemplo abaixo:

Terceiro: Agora, encontre essa seguinte Tag ""]]></b:skin>" na parte do código onde o mesmo expandiu, e para ajudá-lo a localizar melhor, utilize as Teclas de Atalho "Ctrl+F" e pesquise. 

Quarto: Depois de encontrar a Tag, acrescente este seguinte código CSS logo acima dela:

.sidebar .Label li {
padding:3px 5px;
margin:0 3px 3px 0;
float:left;
background-color: #009ACD; /*---cor de primeiro fundo---*/
-moz-border-radius:1px;
-webkit-border-radius:1px;
border-radius:1px;
color:#fff;
}
.sidebar .Label li a, .sidebar .label li a {
color: #FFFFFF;  /*---cor da letra---*/
text-decoration:none;
}
.sidebar .Label li:hover {
background-color: #363636; /*---cor do segundo fundo---*/
}
#tabdiv li, .sidebar li {
list-style-type:none;
}

Prontinho pessoal, agora, clique em Visualizar e veja se tudo ocorreu bem, se estiver tudo certo clique em Salvar.

Alterando o código
Esse código é bem simples de fácil intendimento, veja que eu o destaquei em diferentes cores (#009ACD, #FFFFFF, #363636 ), ou seja, é nesta parte que você poderá alterá-las, e juntamente nestas partes destacada eu também deixei um comentário pra entender melhor.

Para alterar a cor do primeiro plano de fundo, basta alterar a seguinte parte destacada em cor Azul "#009ACD" por um outro código de cor.

A parte destacada em cor Verde " #FFFFFF" é a cor da letra.

Em cor de Rosa "#363636" é a cor do segundo plano de fundo, ou seja, o fundo que é exibido quando passamos o mouse sobre o marcador.

Prontinho, espero terem gostado