Cute Blockquote (2)

Sebelum Hover

Sesudah Hover

Assalamu'alaikum! Resti tadi coba-coba otak-atik kode. Nah, ternyata ketemu nih. Coba lihat diatas! Itu tampilan blockquote'nya nanti kalau sudah jadi. Yuk lihat!


1. Dashboard
2. Template
3. Edit HTML
4. Cari kode (sebelumnya Expand Widget Template dulu)

/*Post
--------------------------------------*/

5. Copy lalu paste kode dibawah ini DIBAWAH kode yang kamu cari

blockquote {

background-color: #FFF5FB;

border:5px solid #FED7E6;

font-family:Comic Sans MS;

font-size:15px;

-moz-border-radius: 1em 4em 1em 4em;

border-radius: 1em 4em 1em 4em;

}

blockquote:hover {

background-color: #FAFEFF;

-webkit-transition-duration: 3.5s;

-moz-border-radius: 25px 10px / 10px 25px;

border-radius: 25px 10px / 10px 25px;

background-image:url(URL BACKGROUND);

background-position:bottom right;

background-repeat:no-repeat;

}

- Merah untuk kode warna kamu
- Biru untuk URL background kamu
- Hijau untuk jenis font kamu
- Oranye untuk bentuk border kamu
- Fuchsia untuk ukuran font kamu

6. Pratinjau dulu lalu save

Semoga bermanfaat! Kalau mau priview yang lebih jelas, klik blog ini

---

Terima kasih telah membaca, tinggalkan komentar ya!

---