Hello viciados em computador.
Eu sei que está muito tarde pra um post, mas é que estou muito animada sabe? Então resolvi trazer esse lindo e maravilhoso tutorial:
Crédito [www]
Esse tutorial é para modelos travel e Simple.
Vai ficar assim:
Então, vamos ao tutorial lindíssimo?
Vá em editar html, dê ctrl + f e procure por:
.main-inner .column-center-inner {
Você vai encontrar:
.main-inner .column-center-inner {padding: 20px 0; } (obs: pode estar diferente)
Abaixo de padding: 20px 0; acrescente:
width: 600;
Agora, procure por </head> e cole abaixo dele:
01
<b:if cond=
'data:blog.pageType != "static_page"'
>
02
<b:if cond=
'data:blog.pageType != "item"'
>
03
<style type=
'text/css'
>
04
#main-wrapper {
05
width
:
910px
;
/* soma da largura da sidebar+area de posts */
06
}
07
.post {
08
border-left
:
2px
solid
#fee
;
/* borda esquerda*/
09
border-right
:
2px
solid
#fee
;
/* borda direita*/
10
border-bottom
:
2px
solid
#fee
;
/* borda do rodape*/
11
border-top
:
2px
solid
#fee
;
/* borda do topo*/
12
box-shadow:
5px
5px
5px
5px
#a1a1a1
;
13
float
:
left
;
14
height
:
200px
;
/* altura do quadradinho */
15
width
:
200px
;
/* largura do quadradinho*/
16
margin
:
6px
;
/* Distancia entre os quadradinhos */
17
padding
:
0
;
18
overflow
:
hidden
;
19
}
20
.post-body {
21
padding
:
0
;
22
margin
:
0
;
23
}
24
.post h
3
{
25
padding
:
0
;
26
}
27
.post h
3
a, .post h
3
a:visited, .post h
3
strong {
28
color
:
#f9b
;
/* cor dos titulos dos posts */
29
background
:
#fff
;
/* background dos titulos dos posts */
30
margin
:
5px
5px
0
5px
;
31
text-align
:
center
;
32
text-shadow
:
1px
2px
3px
#fcc
;
33
border-bottom
:
2px
solid
#fee
;
/* borda abaixo do titulo*/
34
width
:
100%
;
35
font-size
:
15px
;
36
}
37
h
3
.post-title, .post-header {
38
margin
:
0
;
39
background
:
#fff
;
40
}
41
.post img {
42
height
:
100px
;
/* altura da imagem */
43
width
:
200px
;
/* largura da imagem */
44
float
:
left
!important
;
45
border
:
none
;
46
box-shadow:
2px
2px
2px
#a1a1a1
;
47
padding
:
0
;
48
margin
:
0
;
49
}
50
.post-outer, .inline-ad {
51
padding-top
:
0px
!important
;
52
}
53
.post-outer {
54
padding-bottom
:
0px
;
55
}
56
h
2
.date-header {
/* ocultar data apenas na pagina inicial*/
57
display
:
none
;
58
visibility
:
hidden
;
59
}
60
#blog-pager {
61
clear
:
both
;
62
}
63
</style>
64
</b:if>
65
</b:if>
Visualize e se der tudo certo, salve. Você pode personalizar as cores, fontes, backgrounds, larguras, bordas e fazer o seu estilo. Eu acho super fofo e criativo esse modelo para blogs de tutoriais, aprovo e recomendo.
Beijos e até mais.
Flor para o primeiro blog ele está bem fofinho, agora sobre a vaga no recomendo para divulgação irá ter vagas nos destaques apartir do dia 18 de abril, sempre faço joguinhos para quem vencer, pois muita gente me pede uma vaga, então sobre os recomendos e destaques vou fazer um postagem falando sobre isso ok? Amei seu blog.. Roh - Garota no Mundo Hmtl.
ResponderExcluirOnnnnntw *--* obrigada sua fooofa, valeu pelas dicas e incentivos :)))
ExcluirAdorei o post! Talvez eu use esse efeito... ^^
ResponderExcluirThanks' créditos ao blog Reino Kawaii ;)
ExcluirQue legal,adorei o tuto *--*
ResponderExcluir- Love For HTML
Lindão aqui! *u*
ResponderExcluirBrigada flor o/
Excluirmuito bom o tuto, muito bom, adorei *o*
ResponderExcluirkisses
>>ncnosekai.blogsspot.com
\o/ Brigada :D
Excluir