15/08/2012

Estilos de blockquote ¹

||

Yooo fofuchos hoje irei mostrar para vocês como personalizar os blockquote, mas desta vez sem usar imagens ok?Você podem autaera-lo como desejarem.

Eu coloquei como exemplo o texto:

Vacas voadoras atacaram a fabrica de leite, fazendo greve querendo 60 % dos lucros.
Justiça para todas! u.u



Para utilizar um dos modelos abaixo vá em  ]]></b:skin> e cole o codigo desejado a cima dele.

    .post blockquote {
    background: #D5EEFF;
    border-right: 3px solid #099EFF;
    color: #000;
    font-family: tahoma;
    font-weight: normal;
    font-size: 11px;
    text-align: right;
    padding: 3px;
    }


    .post blockquote {
    background: #f5f5f5;
    border-bottom: 3px solid #3C355F;
    color: #3C355F;
    font-family: tahoma;
    font-weight: normal;
    font-size: 11px;
    text-align: right;
    padding: 3px;
    border-radius: 25px;
    }



    .post blockquote {
    background: #E7CAD0;
    border: 1px solid #E57089;
    color: #E57089;
    font-family: century gothic;
    font-weight: normal;
    font-size: 11px;
    text-align: right;
    padding: 7px;
    border-radius: 25px;
    }


.post blockquote {
background: #fff;
border-left: 1px solid #00868B;
border-top: 1px solid #00868B;
border-bottom: 1px solid #00868B;
border-right: 3px double #00868B;
color: #696969;
font-family: courier;
font-weight: normal;
font-size: 11px;
text-align: right;
padding: 7px;
}


blockquote {
border-right: 10px solid #D976A3;
border-left: 10px solid #D976A3;
background-color: #f5f2f3;
padding: 10px;
font-size: 12px;
color: #AE88D4;
text-align: center;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
box-shadow: inset 0 0 15px #ecebeb, 0 0 5px #d2d1d3;
}

blockquote {
border-right: 16px solid #FFA200;
background-color: #FFE2AF;
padding: 10px;
font-size: 11px;
color: #000000;
text-align: center;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
box-shadow: inset 0 0 10px #FFCDAF, 0 0 3px #FF6203;
}


blockquote {
border: 3px solid #fafcfd;
background-color: #F4E9FF;
padding: 10px;
font-size: 11px;
color: #96809F;
text-align: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
box-shadow: inset 0 0 12px #ecebeb, 0 0 5px #d7bce2;
}


E ai gostou?

2 comentários:

  1. Ameeei a dica flor *-* muito obrigada
    http://lacodecabelo.blogspot.com.br/

    ResponderExcluir
  2. De nada que bom que gostou ^^

    ResponderExcluir

Hi guys!!!!
Hey aqui é Wendy, blogueira desde 2010! Viciada em animes, amante de livros e adora ver séries! Criei esse cantinho na intenção de ajudar na criação e personalização de blogs e sites.
Wattpad Facebook Tumblr Instagram