02/02/2014

[Tutorial] Lista personalizada

Oi oi pessoal do bem! -escrevi oi duas vezes- E estou com uma postagem programada básica, então na verdade estou fazendo isso no de tarde, às quatro e meia. Quero que chegue logo amanhã pra eu assistir One Piece e HunterxHunter. Ah é! Amanhã não vou postar, vou usar todo o meu tempo pra ajudar minha mãe a varrer a casa e assistir One Piece e HunterxHunter. Todo dia eu fico em um dilema: "Qual é melhor? One Piece ou HunterxHunter?" Todo dia tenho uma resposta diferente... Hoje estou defendendo One Piece, mas quem sabe amanhã....

Preview (www)

Como fica no post: 
  • Aqui, agora, nunca, hoje ~
  • Listando, listando, listando, listando, listando
  • Lista número três uhuuuuuuuuuuuuul.
  • Texto
  • Texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande, texto grande.
Tô usando um modelo diferente do tutorial, mas a ideia é a mesma!

Acima de ]]></b:skin> cole:
.widget ul, .widget #archivelist ul.flat {
list-style: none;
padding: 3px;
}
.widget ul li, .widget #archivelist ul.flat li {
background: #eee; /*cor do fundo*/
border-radius: 2px; /*borda redonda, se não quiser apague. Se quiser mais redonda aumente o valor*/
padding: 5px 5px 5px 10px; /*espaçamento*/
margin: 2px -10px 2px -10px;
text-align: left; /*alinhamento do texto, mude para center (centro) ou right (direita)*/
color: #444; /*cor do texto*/
text-shadow: 1px 1px 3px #fff; /*sombra do texto*/
-webkit-transition-duration: .80s; /*duração da mudança de cores*/
}
.widget ul li:hover {
background: #baccc5; /*cor do fundo quando passa o mouse*/
color: #000; /*cor do texto passa o mouse*/
text-align: left; /*alinhamento do texto quando passa o mouse, mude para center (centro) ou right (direita)*/
-webkit-transition-duration: .80s; /*duração da mudança de cores*/
letter-spacing: 1px; /*letras se distanciando quando passa o mouse, se não quiser apague a linha*/
}

Para usar aperte este botão:

Se não conseguirem fazer é só comentar aqui em baixo. Espero ter ajudado o/

6 comentários:

  1. O tuto ta ótimo, vou colocar la no meu.
    Ei olhando para seu blog, eu diria que você gosta mais do Hunter x Hunter kkk.
    Abraço.

    ResponderExcluir
  2. Que indecisa em? É quase igual a mim, mais eu tenho só tenho um preferido e pronto nunca troco! Essa sua guerra é uma guerra terrível!
    Eu adorei!
    Vou colocar no meu blog!
    bjs!

    yesmy-lord.blogspot.com

    ResponderExcluir
    Respostas
    1. Eu não, fica uma guerra na minha cabecinha -q
      Que bom que gostou, pode colocar, credite ok?
      Ah é! Vou visitar seu bloguinho u.ú

      Excluir
  3. Adorei, fica bem organizadinho, néh?

    Um beijinho da Gaby-chan -GQCA-

    ResponderExcluir
    Respostas
    1. Fica organizado como nunca eu gosto bastante u.u
      Beijinho pra tu também ><

      Excluir

Regrinhas de convivência ao comentar:

— Pode abusar dos palavrões, mas qualquer ofensa ou desrespeito será excluído, repudiamos machismo, homofobia e qualquer tipo de preconceito e ataque. Odiamos também qualquer cancelamento e problematização excessiva. Façam críticas construtivas;

— "Seguindo, segue de volta?" Sim, mas fale um pouco do post também;

— Façam pedidos à vontade, lemos todos os comentários e sempre respondemos, mesmo que demore;

— No fim do comentário deixe o link de seu blog, se gostarmos, seguimos com prazer.

Layout feito por GNMH, editado por Hari M. Tecnologia do Blogger. Todos os direitos reservados ©