Caixa de texto personalizada!

Olá Cup-Cakes, hoje vamos aprender a colocar Caixa de texto personalizada com efeito CSS, e poderemos utiliza-la para destacar parte de textos nas postagens ou códigos, alem das postagens você pode usar esse CSS nos Gadgets do seu blog, veja como ela tem utilidade...

Clik em "Continue lendo" e aprenda como fazer isso em teu Blog!

Então galerinha, vamos adicionar esse CSS? Então primeiro vamos acessar o painel de edição do seu blog, vá em Modelo >> clique no botão de cor laranja "Personalizar"

Depois que Clicar em modelo aparecerá um novo painel, lá você vai clica na opção "Avançado" >> depois procure a opção Adicionar CSS

Agora pessoal, você vai copiar esse CSS e colar lá na quele campo em branco.

/*---- Classe para definir uma caixa azul vertical ---*/

.caixa_azul {

margin:5px 10px 5px 20px;

border-left:3px solid #A5C9FF;

border-right:3px solid #A5C9FF;

padding:5px 5px 5px 5px;

background: #EBF4FF;

}

/*---- Classe para definir uma caixa vermelha horizontal ---*/

.caixa_vermelha {

margin:5px 5px 5px 5px;

border-top:3px solid #DD3C10;

border-bottom:3px solid #DD3C10;

padding:5px 5px 5px 5px;

background: #FFEBE8;

}

/*---- Classe para definir uma caixa laranja ---*/

.caixa_laranja {

margin:5px 10px 5px 10px;

border:3px solid #FF7800;

padding:5px 5px 5px 5px;

background: #FCDCB8;

}

Depois que você colar o código clique no botão laranja "Aplicar ao Blog"  e depois clique no link >> Voltar para o Blog.

Prontinho pessoal o CSS já está aplicado no seu blog, agora preste atenção logo abaixo eu mostro o código de três cores de caixa que você pode usar:

Azul:

<div class="caixa_azul"> Escreva o seu texto aqui </div>

Vermelho:

<div class="caixa_vermelha"> Escreva o seu texto aqui </div>

Laranja:

<div class="caixa_laranja"> Escreva o seu texto aqui</div>

Agora quando você for escrever uma postagem tem que utilizar alguns desses HTML mostrado aí a cima, observe que são três cores disponíveis então se for usar uma das cores você tem que utilizar o HTML referente a cor.

Para colocar algum Texto dentro da caixa é só substituir a parte que eu destaquei em negrito pelo seu texto.

Entenderam minhas fofuras? Qualquer dúvida deixe nos comentários! Beijinhos! 

Posty By: Patricia