14/05/2013

Tutorial - Personalizar listas com marcadores


Boa noite, pessoas cheirosas

A escola está me matando. Ontem tive prova de matemática, eu achei boa, mas não estou muito confiante. Para piorar, amanhã vamos ter avaliação de inglês e também de literatura. Não adianta, nunca temos tempo para descansar. Semana passada tivemos prova de gramática e a professora já agendou outra para quinta-feira. Arrrrghhh, eu não aguento mais!. Então, saindo desse assunto que ninguém gosta, eu estou bastante ansiosa, essa semana, na sexta, eu, meus pais, os pais da minha friend e a minha friend vamos para um hotel em costa do sauípe. Vai ser tão bom!. #Férias -sqn, #picina #gigante #banheira #teatro #comida #engordar #50 quilos. Isso é ótimo, pagamos o hotel e podemos comer a vontade de tudo que tiver lá, aproveitar tudo de lá de graça!. Eu não vejo a hora, estou muito cansada da escola. Ah, lembra do meu óculos? - eu tenho que trocar de ano em ano - Ele chegou na cidade em qual pedimos ele, ou seja, eu não vou ser mais cega!, ebá!

Então, o nome do blog é HTML todo dia, mas tem, se não me engano, meses que não posto nenhum tutorial. Eu vou variar um pouco e postar este. Tem gente que só posta o tutorial de efeitos que mil e quinhentas pessoas já viram. Eu sempre procuro achar um mais desconhecido para ficar mais legal a coisa. Então, vamos ao tutorial?


Se não entenderam, o tutorial é, basicamente, isto:



Viram o coração rosa ao lado?, então, aquilo, é isto:

  • Esta bolinha :3
Ela que fica do lado do título dos marcadores usando este tutorial.


Você deve colar todos os códigos acima de ]]></b:skin>. Vamos lá!

  • Para a sidebar:


1
 .sidebar ul li {
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom:1px solid #fee;
    padding: 0 0 4px 12px;
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwVyyZPG92_4uPhFdGnqCrZpyMB9EoVwS-i5PcuKhL4TjFeDQBysNQdFNvVbYfuU8FO_PT_-DGcuUQKLjRHt9nrxcLjYOhzx_LxgCm7kdrI_QjOY338i85gpuMoQm_85poqK_KamC9/s1600/mini-153.gif") no-repeat 0 2px;
} 




  • Para os posts:

1
 .post ul li {
	list-style: none;
	margin: 0;
	padding: 0;
    padding: 0 0 4px 12px;
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwVyyZPG92_4uPhFdGnqCrZpyMB9EoVwS-i5PcuKhL4TjFeDQBysNQdFNvVbYfuU8FO_PT_-DGcuUQKLjRHt9nrxcLjYOhzx_LxgCm7kdrI_QjOY338i85gpuMoQm_85poqK_KamC9/s1600/mini-153.gif") no-repeat 0 2px;
} 




  • Geral (dependendo de como personalizou seus comentários, a imagem aparecerá do lado do avatar de cada comentarista):

1
li {list-style: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwVyyZPG92_4uPhFdGnqCrZpyMB9EoVwS-i5PcuKhL4TjFeDQBysNQdFNvVbYfuU8FO_PT_-DGcuUQKLjRHt9nrxcLjYOhzx_LxgCm7kdrI_QjOY338i85gpuMoQm_85poqK_KamC9/s1600/mini-153.gif) circle;} 






10 comentários:



Por favor, não peça nada pelos comentários, para isso temos a nossa Ask.

Os comentários daqueles que não se indentificarem seram publicados, mas não serão respondidos.

A moderação de comentários está ativa, tome cuidado com o que fala!

Pedidos de afiliação só ná página de afiliados

Não respondo mais comentários do tipo "seguindo segue de volta?"

Nao tenha preguiça de comentar, comentar nã vai fazer seus dedos caírem.