segunda-feira, 27 de agosto de 2012

Data personalizada+Imagens para início de post

Yoo meus Pikachus!Ah,por favor,sigam o Tumblr do blog:World Of Tutos.. Hoje vou ensinar como deixar a data redondinha e hover!Créditos:Sweet Girl
Primeiro vá em Configurações-Idioma de formatação-Formato da data e coloque que nem na imagem:
Clique para aumentar!
Depois vá em Editar HTML e procure pela 1ª linha do  código abaixo:

main-inner h2.date-header {
  font: $(date.font);
  color: $(date.text.color);
}
Então apague essa parte e substitua por:
.main-inner h2.date-header {
float: left; /** data no lado esquerdo, pode mudar para right **/
width:55px;/** largura **/
height:55px;/** altura **/
overflow:hidden;
font-size:15px;/** tamanho da fonte **/
color: #fff !important;/** cor da fonte **/
text-align:center;/** alinha o texto **/
margin-bottom: -65px; /** desce **/
margin-left: -80px; /** margem pra esquerda **/
padding: 8px 2px 0px 2px; /** espaço interno: topo, direito, embaixo, esquerdo **/
-webkit-border-radius: 5em; -moz-border-radius: 5em; /** borda redonda **/
background: #FF6C91; /** cor do fundo **/
}
.main-inner h2.date-header:hover {
background: #E9B4BB; /** cor do fundo hover **/
}
Modifique de seu jeito!
Imagens,do anime/mangá Naruto





































Nenhum comentário:

Postar um comentário