Tooltips adalah sebuah kotak informasi yang muncul bila suatu teks / link dilewati oleh cursor mouse.
istilah tooltips memang jarang sekali terdengar namun keberadaannya juga cukup membantu seseorang dalam memberikan informasi tentang suatu cara, metode, atau petunjuk pada sebuah button atau link ..
Ada banyak cara untuk membuat tooltip tersebut , salah duanya yaitu dengan Css dan Javascript . sesuai dengan judul diatas maka kita gunakan Css saja dulu karena Css lebih mudah dari Javascript 
Download source programnya disini........
berikut adalah cuplikan source code berupa masing-masing class yang mendefinisikan tentang warna background , ukuran dan warna border .
.simple {padding-top: 0.8em; padding-right: 10em; padding-bottom:0.8em; padding-left: 1em; }
.custom {padding: 0.5em 0.8em 0.8em 2em; } * html a:hover { background: transparent; }
.simple {background: #FFFFff; border: 2px groove #FF0000; }
.sepeda {border: 3px dotted #FF3334; background-color: #E1E1E1; }
.joget {background: #9FDAEE; border: 1px solid #2BB0D7; }
.info {background: #8ECF91; border: 1px solid #2BB0D7; }
.warning {background: #FFFFAA; border: 1px solid #FFAD33; }
Contoh Tooltips