Highlight Author Threaded Comments II

Highlight Author Threaded Comments II

11 Comments

Kali ini saya akan terangkan bagaimana cara membuat highlight autor threaded comments dengan css. Trick ini cukup mudah untuk diterapkan. Kolom autor comments dilengkapi dengan efek hover, sehingga bila cursor anda di arahkan pada kotak komentar admin akan berubah. Kalau anda mau lihat keunikannya, perhatikan tulisan Admin akan amin. Sekarang mari kita bahas cara pembuatannya. Ikuti langkah berikut.

highlight autor threaded comments

Masuk ke blogger
Klik Rancangan
Klik Edit HTML
Masukkan css berikut di atas kode ]]></b:skin>
.comment-block{position:relative;padding:8px;border:1px solid #ddd;border-radius:4px}
.comment-block .icon.blog-author{position:absolute;right:0;bottom:0;background:rgba(174,212,251,0.2) url(https://lh4.googleusercontent.com/-4yHK-5f238M/T3-C_VbTGqI/AAAAAAAACRc/wJXHql7XEOc/s128/gubhugreyot-admin-6transp.gif) bottom right no-repeat !important;width:100% !important;height:100% !important;margin:0 !important}
.comment-block:hover{background:rgba(139,139,139,0.1);border:1px solid #eee;box-shadow:4px 4px 4px #444}
.comment-block:hover .icon.blog-author{width:60px !important;height:22px !important;background:url(https://lh4.googleusercontent.com/-4yHK-5f238M/T3-C_VbTGqI/AAAAAAAACRc/wJXHql7XEOc/s128/gubhugreyot-admin-6transp.gif) bottom right no-repeat !important;background-size:60px 22px !important}
Klik Simpan Template dan lihat hasilnya
Selamat mencoba dan sukses selalu


"keep spirits and do the best"
Mau belajar trick dan tips blogging lengkap dan mudah?... BACA DI SINI

About the Author

Blogonol adalah Blog - 0 atau blog kosong dengan konten tutorial blog, seo, widget, template gratis, dan blog info yang dikonsep secara sederhana untuk belajar membangun blog yang lebih baik.