Trata-se de personalizar as formatações de texto de um blog com CSS, ou seja, deixar negrito, itálico,
O código que vou disponibilizar ficará assim:
Ele já vem com efeito hover para riscado (ao passar o ponteiro sobre a palavra a linha some) e sublinhado (ao passar o ponteiro sobre a palavra a linha muda de cor).
Para isso adicione este código acima de ]]></b:skin>:u {/* Sublinhado */
text-decoration:none;
color:#61D2D6;
border-bottom: 1px solid #9BF0E9;
-webkit-transition: 0.4s;
}
u:hover {/* Sublinhado hover */
border-bottom: 1px solid #EDDE45;
-webkit-transition: 0.4s;
}
b, strong { /* Negrito */
color: #ED146F;
font-weight: bold;
}
i,em { /* Italico */
color: #EA3556;
text-decoration: none;
}
strike { /* Riscado */
text-decoration: strike;
color:#EB9F9F;
}
strike:hover { /* Riscado hover */
text-decoration: none;
color:#EB9F9F;
}
Visualize, salve e pronto. Para mudar a cor é só alterar o código que estiver acompanhado com um "#". Para mais cores clique aqui.
Agora toda vez que você usar uma das formatações em seu texto, ficará como definido no código acima. Espero que lhes seja útil.
Beijus ;3
Mais uma vez, arrasou!
ResponderExcluirSempre quis deixa ro efeito hover no sublinhado e nunca conseguia. Obrigada!
Obs.: não uso esse efeito ,o meu não é hover, mais eu amei!
Beijos, Gaby *----*
adorei a dica!!!!
ResponderExcluirbj
Leandra - www.cherryboomshop.com
Gostei por causa do efeito hover para riscado! Mto obrigada =)
ResponderExcluirOie, adoro esse blog, estou seguindo ^_^ eu tenho uma duvida, poderiam por favor me responder? é que eu queria saber como faço pra colocar mini gifs pelo meu blog? tipo vc colou um gif de uma menininha na sua bio e um gif no canto direito embaixo da tela e outros espalhados pelo blog e eu nao sei por :( me ajuda please"""
ResponderExcluirObrigada ^^ Bom, o da menininha está em um gadget HTML/JavaScript, então é só adicionar uma URL da imagem como você faria normalmente em um post por exemplo, se adicionar pelo HTML da postagem (aquele que fica em img src=...).
ExcluirJá os dos cantinhos funcionam em um tutorial que em breve postarei aqui, servem para deslizar para cima, para baixo...
Os demais, como brilhos e fadinhas, já postei como no post Magia em HTML: Criando Efeitos Kawaii (veja em arquivos)
Acho que é isso ^^ Se houver alguma coisa mais pode perguntar ok?
Beijus ;3
desculpe pela burrice.É que sou mei desligada pode me dizer aonde faz esse négocio do HTML?
ExcluirImagina, e não é burrice perguntar sobre o que se tem dúvida :3
ExcluirBem, em os gadgets ficam na opção Layout; lá você clica onde diz: Adicionar um gadget. E depois escolhe a opção HTML/JavaScript. Já nos posts tem uma opção HTML na parte de cima de onde se digita em que são mostradas tudo o que a gente escreve em HTML. Por exemplo, para adicionar uma imagem vc deve posta-la ou fazer o upload no ícone de imagens; depois disso clique na opção html para ver como ficou.
Oi Roberta precisando de sua ajuda...rs ,você postou esse tuto maravilhoso mas a pessoa aqui não queria por tudo isso,eu queria por uma linha divisória no titulo da postagem mas não sei como fazer e onde colocar,você pode me salvar,rs...vou ficar esperando...bjs e um abençoado domingo.
ResponderExcluirVoce se refere a algo tipo um sublinhado neh? Se for, antes de /b:skin ou na area de codigo dos posts no html do seu lay, ou ainda no css do designer de modelo, cole isso:
Excluirpost h3 a, .post h3 a:visited, .post h3{border-bottom: 3px dotted #fcc;}
3 eh a espessura, dotted eh o tipo, que no caso seria pontilhado e #fcc eh o codigo da cor.
Seria isso? Espero ter ajudado, mas por favor, se estiver com duvidas, me avise ok?
Beijus..