Freebies Blockquote

ini dia freebies blockquote! tutorial pemasangannya di Bunny's Angel >> Memasang Blockquote yah ..

Freebies Blockquote

• Pinky Hover Blockquote. (BL)

(Nanti, kalau dihover, bordernya hilang dan akan berwarna putih. penasaran? Coba sendiri ^^

KODE:

blockquote {
background:#FFF2F5;color: #ffffff;border-radius:5px;border:1px solid #FFDBE2;border-right:15px solid #FFDBE2;color:#000000;padding:4px;-webkit-transition: 2s;}blockquote:hover {background: #FFFFFF;color: #000000;border:1px solid #ffdbe2;border-right:1px solid #FFDBE2;border-left:15px solid #FFFFFF;-webkit-transition: 2s;}

• Blockquote Like Mine (BL)

The testing blockquote

(nanti blockquotenya edit SENDIRI ya, backgroudnnya jangan plagiat aku!!)

KODE:

blockquote{
background:url(BACKGROUND URL);
padding:10px;
color:#000;
letter-spacing:1px;
border-radius:10px;
border:2px solid #ccc;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
text-shadow: -1px 0 fff, 0 1px fff,
1px 0 fff, 0 -1px fff;
}
blockquote:hover{
background:url(Background URL SETELAH DI hover);
background-position:50% 50%;
}

•  Suprise Blockquote (SK)

Kenapa kunamakan suprise? karena hovernya tidak kutampilkan! Ada hovernya kok! Tapi 1 clue, hovernya itu icon!! yahh, bukan suprise dong? hahaha ...

KODE:

blockquote {
background-image:url(URL BACKGROUND);
border:1px dashed #D16587;
padding: 5px;
}
blockquote:hover {
background-image:url(URL ICON);
background-position:bottom right;
background-repeat:no-repeat;
}

• Line Blockquote (SK)

Ini aku asal buat nama yaa,hehehehe ...

(Nanti kalau dihover garis pink diatasnya hilang dan akan berganti dengan garis merah dibawah)

KODE:

blockquote{background:#KODE WARNA;padding:10px;color:#808080;border-top:3px solid #KODE WARNA;border-bottom:0px solid #FF8D8D;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;-ms-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}blockquote:hover{border-top:0px solid #ffd5d5;border-bottom:3px solid #KODE WARNA;}

Cukup dulu yaa, ini masih PART #1 lho ..