Membuat Blockquote Lebih Menarik Dengan CSS

Saturday, April 25, 2015
Membuat Blockquote Lebih Menarik Dengan CSS

Membuat Blockquote Lebih Menarik Dengan CSS - Apa sih Blockquote itu? Blockquote adalah tanda yang digunakan untuk menandai suatu tulisan yang penting, sehingga tampak berbeda dari tulisan yang lainnya. Blockquote ini sebenarnya sudah namun bawaan Blogger terlihat kurang menarik. Oleh karena itu saya akan membagikan cara Membuat Blockquote Lebih Menarik Dengan CSS.

Cara Membuat Blockquote Lebih Menarik Dengan CSS :

1.  Login akun Blogger anda, lalu masuk ke halaman dashboard blog anda.
2. Pilih menu Template, lalu klik HTML.
3. Cari kode blockquote yang sudah ada di template anda. Agar lebih mudah dalam mencarinya gunakan CTRL + F
4. Jika sudah ketemu, silahkan ganti dengan kode berikut.

 blockquote{display:block;font-style:normal;color:#FFF;padding:15px 18px 15px 45px;position:relative;background-color:#1BBCE4;border-radius:4px;border-bottom:2px solid #0E7994}
blockquote:before{font-family:FontAwesome;display:block;position:absolute;top:15px;left:16px;color:#fff;font-size:20px;line-height:1}
blockquote:before{content:"\f10d"} 

5. Klik Save.
6. Selesai.

Jangan lupa sesuaikan tampilannya dengan template anda

Sekian artikel kali ini, semoga bermanfaat.

Terimakasih

Artikel Terkait

Previous
Next Post »

Peraturan berkomentar :

- Berkomentarlah dengan relevan sesuai artikel.
- Gunakanlah bahasa yang sopan dan baku.
- Dilarang menggunakan link hidup.
- Dilarang menghina dan mencela.
- Dilarang SPAM!
- Dilarang mengandung unsur SARA!

Jika ada yang melanggar, komentar akan langsung saya hapus.


Terima Kasih Telah Berkunjung ^_^

EmoticonEmoticon