Novos estilos para título de sidebar

Oi meus docinhos de coco! (um acento ali no coco ia dar merda) Hahaha. Tudo bom com vocês? Espero que sim. Hoje trouxe novos modelos de títulos de sidebar. Caso você não saiba do que eu esteja falando, clique aqui, e veja o post explicando. Ah, e fiquei feliz por saber que (quase) todos gostaram do layout. Eu gostei bastante dele! Sem mais blá blá blá, vamos ao que interessa: os novos estilos para títulos de sidebar. E aí, bora?

TÍTULO DO GADGET

.sidebar h2 {
background-color: #f9f9f9; ---/* cor do fundo */
border-radius: 20px;
border: 1px dotted #ccc; ---/* expressura, tipo e cor da borda */
color: #33cccc; ---/* cor da fonte do título */
font-size: 12px; ---/* tamanho da fonte do título */
font-weight: bold;
padding: 10px; ---/* margem interna */
text-align: center; ---/* alinhamento do título */
text-transform: uppercase;
}

título do gadget

.sidebar h2 {
-moz-border-radius-bottomright: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-bottom-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
border-top-right-radius: 10px;
color: #ffffff; ---/* cor da fonte do título */
background-color: #33cccc; ---/* cor do fundo */
font-size: 14px; ---/* tamanho da fonte do título */
font-family: georgia; ---/* fonte do título */
font-style: italic;
padding: 5px; ---/* margem interna */
text-align: center; ---/* alinhamento do título */
text-transform: lowercase;
}

Título do Gadget

.sidebar h2 {
background-color: #000; ---/* cor do fundo */
border-radius: 30px;
border: 2px solid #ccc; ---/* espressura, tipo e cor da bora */
color: #fff; ---/* cor da fonte do título */
font-family: georgia; ---/* fonte do título */
font-size: 15px; ---/* tamanho da fonte do título */
font-style: italic;
padding-bottom: 7px; ---/* margem interna de baixo */
padding-left: 7px; ---/* margem interna da esquerda */
padding-right: 20px; ---/* margem interna da direita */
padding-top: 7px; ---/* margem interna do topo */
text-align: right; ---/* alinhamento do título */
-webkit-transition:0.4s;
}

.sidebar h2:hover {
background: #ccc; ---/* cor do fundo ao passar o mouse */
color: #000; ---/* cor da fonte do título ao passar o mouse */
-webkit-transition: 0.4s;
}

Espero que tenham gostado! O último estilo acho que vocês irão gostar mais, por causa do efeito hover. Comentem, e me enviem sugestões para postagens. Beijonas, Emily.

Esses códigos são como Tables, mais são mais fáceis de usar. Apesar de serem de uma linha apenas. Copie um dos códigos abaixo, e em seguida vá até Design > Editar HTML, e proucure por ]]></b:skin> e logoACIMA cole o código. 

.sidebar h2 {
text-align: center;
background-color: #F1F1F1; ---/*cor de fundo */
width: 265px;
height: 20px;
font-size:13px; ---/* tamanho da fonte */
text-shadow:0 1px 1px #c9c9c9;
border-bottom: 1px solid #DEC4F4; ---/* cor da linha */
A, A:link: #000000;text-decoration:none; }

.sidebar h2 {
text-align: right;
background-color: #F1F1F1; ---/*cor de fundo */
width: 265px;
height: 20px;
font-size:15px; ---/* tamanho da fonte */
font-color:#707070; ---/* cor da fonte */
text-shadow:0 1px 1px #c9c9c9;
A, A:link: #000000;
text-decoration:none;
border-top: 3px double #FF0080;
border-bottom: 1px solid #000000; }

.sidebar h2 {
text-align: left;
background-color: #E8E8E8; ---/*cor de fundo */
width: 265px;
height: 15px;
font-size:12px; ---/* tamanho da fonte */
text-shadow:0 1px 1px #c9c9c9;
A, A:link: #000000;text-decoration:none;
border-bottom: 3px double #44D0D0;
border-top: 1px solid #c9c9c9; }

Acompanhe

.sidebar h2 {
a: link: #000000;
background-color: #f1f1f1; ---/* cor do fundo */
border-bottom: 1px dashed #dd04dd;
font-color: #707070; ---/* cor da fonte */
font-size: 15px; ---/* tamanho da fonte */
height: 20px;  ---/* altura do título */
width: 265px; ---/* largura do título */
text-align: center;
text-decoration: none;
text-shadow: 0 1px 1px #c9c9c9; ---/* cor da sombra da fonte */
}