Oi, oi!!! Eu estou falhando muito aqui no blog, um motivo já falei aqui que foi meu comutador que queimou e outro motivo é a escola, estou tentando associar blog com escola, mas vou consegui.
Não sei se já falei, mas estou no 3º ano do ensino médio, então tenho que me dedicar mais, mas não quero abandonar o blog. Eu não faço cursinho, pois o único cursinho daqui é horrível lá falam de assuntos que não cai no Enem e nem no Prise, por isso estou usando a internet a meu favor nessa parte.
Gente quando for minha vez de postar vai ser apenas a tarde, pois como disse eu estudo e faço e vejo vídeos aulas e isso ocupa bastante tempo.
Vamos ao que interessa.
Vocês se lembram que
um tempinho atrás eu ensinei como criar um modelo de Sidebar (básico), pois é
agora o pedido foi para Ensinar a Criar
um Modelo para Post e esse também será o básico, primeiro siga esses passos aqui de como separar em caixas, mas se não quiser não faça.
Para começar abra seu
Bloco de notas ou algum programa
parecido pode ser até na caixa de HTML e cole isso:
Se caso você fizer na
caixa de HTML procure por: h3.post-title
a {
h3.post-title {
}
h3.post-title a {
}
Cole abaixo de h3.post-title { e antes de }
Esses códigos:
margin-top: -5px;
background: #fff;
Essa parte é a cor do
fundo do título.
margin-top: é a “altura”
do título do post, tipo de você diminuir ele sobe e se você aumentar ele desce.
background: é a cor
do fundo do título do post, mas se quiserem uma imagem no lugar da cor coloque:
background: url(LINK DA IMAGEM)repeat;
Recomendo que deixem
a cor por causa das letras, mas se quiserem usar, use uma imagem sem muitos
detalhes.
E quiserem colocar
uma borda ao redor do título da postagem é só colocar o seguinte código:
border: 1px solid #000;
Mude o que for
necessário.
Se quiser uma
bordinha abaixo do texto cole isso.
border-bottom: 1px solid #000;
Explicado a primeira
parte vamos para a segunda.
Cole abaixo de h3.post-title a { e antes de }
Esses códigos:
font-family: Verdana;
font-size: 16px;
color: #fff;
Essa parte é onde
você irá definir a fonte
font-family: é a
fonte obvio do título do post
font-size: é o
tamanho da fonte
color: é a cor da
fonte
Se você quiser
colocar uma sombra na fonte coloque esse trecho:
text-shadow: 0px 1px 1px #eee;
Esses trechos abaixo
serve como transição, então se quiser colocar:
-webkit-transition: color 0.4s ease-in;
-moz-transition: color 0.1s ease-in;
transition: color 0.4s ease-in;
A criação do modelo
de post é bem parecido com o do modelo de Sidebar, o que mais precisa é
criatividade, entender um pouco sobre HTML, você pegar um modelo de Sidebar e
fazer um modelo de post e isso serve ao contrário.
Para incrementar mais
seu modelo é só procurar tutoriais, existe vários.
Não está bem explicado, pois me atrapalhei um pouco.