Faixas para o título da postagem+Tutorial

Uploaded Picture


Olá meus bebês, hoje não estarei aqui o tempo todo de vigia no blog, o Tea with cake está sobre a minha responsabilidade, tenho que estar postando lá por hoje, sexta, sábado, domingo, as postadoras (dona, sub-dona) estão viajando, a Débora (sub-dona dele) me deixou um recado antes de ir viajar, então, já deixei o recado.

Estou ansiosa  para o meu primeiro dia de aula na nova escola, o ruim mesmo é entrar sem conhecer ninguém. O pior é que de fato ainda não sei que dias começa minha aula, mas eu também estou muito ansiosa pra ir comprar os meus materiais. Hoje eu trouxe para vocês algumas imagens (faixas) para o titulo da postagem que no caso eu acho que fica super fofo em layout organizado, e trouxe junto o tutorial, resolvi trazer logo por quê amanhã não poderei postar ou sim q 
O tutorial veio do TMR ~
Vamos começar com o tutorial de uma vez >3<

Personalizando o título da postagem com imagem.
1. Primeiramente o código responsável pela personalização do h3 é o h3.post-title { A partir daí você vai dar uma pesquisada por isso através do f2. Achou ? Então após isso irá substituir todo o código existente por isso:

background-image: url ('img');
padding-top: nºpx;
padding-left: nºpx;
padding-bottom: nºpx;
padding-right: nºpx;
width:100px;
height:100px;
margin-top:
margin-bottom:
margin-left: (Se sua flutuação for right mude o left);
float: (lado da flutuação right or left); } 
OBS::. Com o padding você movimenta e acerta as LETRAS e com o margin você movimenta e acerta sua imagem para os lados ou para cima e para baixo.
Personalizando o h2 da sidebar com texto.
1. Primeiramente você tem duas opções, pode optar por ir personalizando pelo h2 { já existente. Ou pode ir personalizando também pelo .sidebar .widget { Não tenho muito o que explicar, se você conhece o básico desse tipo de personalização vai por esses códigos criando seu próprio modelo de texto na side. Caso não tenha entendido, um exemplo:

.sidebar .widget {
padding: 5px;
background: #000px;
font: normal normal 8px "pf arma five";
color: #fff;
margin-top: 20px;
}
Clique para ampliar ~
1. modelinho.
2. modelinho.
3. modelinho.

20 comentários:

  1. Adorei! Só que acho meio complicado kkkkk
    Um beijo
    http://bombasticmusics.blogspot.com

    ResponderExcluir
  2. Eu vi que você tinha entrado para o Tea with Cake, e agora na sua responsabilidade, uau. Sinceramente, quando entrei em outra escola á uns 5 anos anos atrás e permaneço na mesma até hoje, foi bom porque fiz amizade muito rápido e meio que você é o centro das atenções, pelo menos foi isso que aconteceu comigo, mas enfim, boa sorte com as suas aulas. Eu já conhecia o tutorial e tudo mais, estou pensando em usar no meu próximo layout porque é muito fofo :3

    Having Cherry ☁

    ResponderExcluir
    Respostas
    1. E quanta responsabilidade viu AUHUAHSAUUHA ♥3♥

      Excluir
  3. Amei as faixinhas, so cute!
    www.htmlcherries.blogspot.pt

    ResponderExcluir
  4. QUe coisa isso da escola hein u.u pena que nao consegui ler o post direito , as barrinhas do blog n deixam :c
    Vo usar no meu proximo lay 0/

    Geekegirlie.blogspot.com || G² Official

    ResponderExcluir
    Respostas
    1. Que fofinha, vou querer ver este layout hein *o* ♥

      Excluir
  5. Que perfeitos *-* Tudo com o style do ultimo modelo me conquista u-u

    http://np-nadapopular.blogspot.com/

    ResponderExcluir
    Respostas
    1. Eu amei os do primeiro modelinho *u* Obrigada *33*

      Excluir
  6. Eu já tinha visto esse tuto no TMR, amo usar faixinhas nos títulos das postagens, mas como os meus layouts já são bem exagerados, tenho deixado isso meio de lado.
    As faixinhas são lindas. *u*
    Beijos!

    www.blogblackcherry.com

    ResponderExcluir
    Respostas
    1. Sim >33< pois foi de lá que eu rebloguei ASUHSAHUSAHUASHU'
      Seus layouts são perfeitos My >< obrigada ♥3♥

      Excluir
  7. Que lindinhas, gostei muito do terceiro modelo. *3*

    http://maiira-t.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Todos gostaram do terceiro modelo SAUSUHUH' *3*

      Excluir
  8. Bem primeiramente como eu gostei do resultado deste layout, nossa bem fofo mesmo amei como ficou *----*, e como estas faixinhas são lindas Vaah (;*△*;) amei todas!!!! E tipo voltar as aulas é osso me lembro muito bem desta época no início era chato mas depois me acostumava =3 Beijocas linda.

    Garota No Mundo Html
    Having Cherry

    ResponderExcluir
    Respostas
    1. Obrigada UHASHAUSHU', é muuuito osso, e bem ruim - sempre perco a minha vontade de levantar cedinho pra ir, ainda mas eu que vou estudar de manhã q
      Beijos ♥

      Excluir
  9. que coisas lindas eu usaria mas acabei de mudar meu lay, quem sabe no próximo, adorei o blog e já estou seguindo,aguardo a sua visitinha em meu blog, beijão e fique com deus..
    http://zombiecutie.blogspot.com.br/

    ResponderExcluir
  10. Adorei o tutorial, fica lindo é só saber usar :3 Ps.: O layout tá show!

    uns-killed.blogspot.com

    ResponderExcluir
  11. Que fofas ^-^
    Adorei o primeiro modelo :3
    O tuto é meio complicado aheuahuea,mas acho que vale muito apena <3
    Bjs :3
    just-a-dream.tk

    ResponderExcluir
  12. Que lindas, me apaixonei, irei me casar com o ultimo modelo *ooooooo*

    Pudding ~

    ResponderExcluir

❤ Ofensas e palavrões serão ignorados e excluidos.
❤ Seguindo, segue de volta?Sim mas fale um pouco do post.
❤Nada de pedir post pelo os comentários , se quiser algo vá na página peça .
❤Se quiser pode deixar a URL do seu blog , sempre vou retribuir a visita!
❤Perguntas/Dúvidas , serão respondidas :-)
❤Se não gostou, não use palavras ofensivas.

« »