tutoriais category image
Blockquote Personalizado
Saturday 15/04/2006 às 15:55 | Arquivado em: Css, Tutoriais

Modelo 1

01. Coloque depois no seu arquivo style.css

blockquote {
border: 1px solid #FFD0DF;
background-color: #FFF1F5;
padding: 10px;
font-size: 11px;
color: #808080;
text-align: justify;
}

02. E no lugar em que você quer que apareça o blockquote coloque:

<blockquote>Seu texto aqui</blockquote>

Modelo 2

01. Coloque no seu arquivo style.css

blockquote {
border: 1px solid #FFD0DF;
background: #FFF1F5 url(http://www.endereço/edit.gif) no-repeat top left;
padding: 10px;
font-size: 11px;
color: #808080;
text-align: justify;
padding: 10px 10px 10px 35px;
font-size: 11px;
text-align: justify;
}

02. Faça uma imagem com as aspas mais ou menos assim:

03. Substitua no código "http://www.imagem.com.br/edit.gif" pelo endereço da sua imagem.

04. E no lugar em que você quer que apareça o blockquote coloque:

<blockquote>Seu texto aqui</blockquote>

05. Se você quiser pode variar o estilo mudando os atributos de borda, tamanho, cor, etc.

Se você não tem um arquivo style.css, troque a linha:

blockquote {

por

.blockquote {

E para usar o Blockquote:

<div class="blockquote">Seu texto aqui</div>

Posts Relacionados




15 Comentários em “Blockquote Personalizado”



Anderson 29-04-2010 | 17:07 Responder

Veja só heim, post de 4 anos e hoje me ajudou hehe. Obrigado!

Emily Caroline 30-06-2011 | 19:27 Responder

Adorei! Funcionou direitinho no Blogger. Só em vez de colar acima de ]]
Beijos lindinha! 8

luana oliveira 07-08-2011 | 10:16 Responder

Adorei, usei ele em meu blog mas agora eu coloquei outro, assim que puder eu trooco *-*
bjs e amo seus tutos ♥ 34

Murillo Quintino 28-12-2011 | 03:07 Responder

Gostei muito daqui!
Tudo muito lindo.
Feliz ano novo!

Fernanda 01-02-2012 | 21:35 Responder

Aaaaaaai, valeu Tamara! Eu tava com uma pequena dúvida em relação às aspas e seu tutorial me ajudou! :D




Comentar


Os comentários desse blog são MODERADOS, portanto só serão publicados após a minha aprovação. Comentários com propagandas e divulgações não serão aprovados. Obrigada.





38 37 36 35 34 33 32 31 30 29 28 27 26 25 24 23 21 20 19 18 17 16 15 14 13 12 11 10 9 8 6 5 4 3 2 1