Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> CSS

สร้าง Tooltip แสดงเมื่อ hover ด้วย CSS

ใช้คุณสมบัติ visibility เพื่อสร้าง tooltip ที่แสดงเมื่อ hover เมาส์

ตัวอย่าง

<!DOCTYPE html> <html>    <style>       #mytooltip #mytext {          visibility: hidden;          width: 100px;          background-color: black;          color: #fff;          text-align: center;          border-radius: 3px;          padding: 10px 0;          position: absolute;          z-index: 1;       }       #mytooltip:hover #mytext {          visibility: visible;       }    </style>    <body>       <div id = "mytooltip">Hover the mouse over me          <p id = "mytext">My Tooltip text</p>       </div>    </body> </html>