Tool Tips Box Untuk Informasi Artikel

Tool Tips Box sering di gunakan sebagai media infrmasi dari artikel sobat. Tool Tips Box sering di gunakan untuk memberikan penjelasan yang lebih tegas atau membuat catatan khusus dari artikel yang sobat blogger buat.

Tool Tips Box ini juga berguna untuk tempat menyisipkan kode-kode script yang ingin sobat tampilkan untuk referensi pembaca sobat.

sebelumnya ada baiknya sobat bloger melihat contoh dari tool tips tersebut :

Kotak Tool Tips untuk informasi - info

Kotak Tool Tips untuk catatan - note

Kotak Tool Tips Untuk Peringatan - warning

Kotak Tool Tips Untuk Download - download

Bagaimana cara membuat Box tool tips tersebut ?

cari kode ]]></b:skin>
letakan kode dibawah di atas kode ]]></b:skin>

/*Box Tool tips 1*/
.tooltips_box {
    padding:20px 15px 20px 15px;
    margin-bottom:20px;
    font-size:14px;
    letter-spacing:.3px;
}
/*Tambahkan border, warna latar belakang, dan gambar latar belakang (icon)*/
.tooltips_box {
    background:#ffcccc url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTUq360pkheVZNKHJCkQ7xQOst7KNeW7KZ68vjnf-FuMlmiyxkIxmbP6wEcI8zHDQ32dDaN-7eKN1FiLzFjsK2SgRHvq6PERbeOpwdXnd7MM-2g-LEcqvSvhouZDZtOU6atu9LMtYRp0M/s1600/icon1.png) no-repeat 10px 15px;
    border:1px solid #ff9999;
}

HTML

 <div class="tooltips_box">
Selamat anda sudah berhasil untuk membuat kotak tool tips
</div>

Selamat anda sudah berhasil untuk membuat kotak tool tips
Sumber Artikel :
Blog Abd Rahman
Link : http://jelasinblog.blogspot.com/2014/05/mudahnya-membuat-info-box.html

Download Source Lengkap di ZIDDU

Sumber Artikel : Abd. Rahman