Tất cả bài viết | CSS3
Tạo Tooltip bằng CSS3
Hướng dẫn tạo Tooltip bằng CSS3
Phần định nghĩa CSS
body { font-family:Arial; font-size:14px } h1 { margin-bottom:10px; } .tooltip { display: inline; position: relative; } .tooltip:hover:after { background-color: #000000; background-color: rgba(0, 0, 0, 0.85); -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; bottom: 26px; color: #FFFFFF; content: attr(data-tooltip-text); left: 20%; padding: 5px 10px; position: absolute; width: 130px; z-index: 1000; } .tooltip:hover:before { border: solid; border-color: rgba(0, 0, 0, 0.85) transparent; border-width: 8px 8px 0 8px; bottom: 18px; content: ""; left: 50%; position: absolute; z-index: 1001; }
Phần định nghĩa HTML
-
Tags:
- Tạo Tooltip
- CSS3
- Tooltip
- JQUERY
- Javascript
- RWD
CSS3 Xem (3374) Học thiết kế web giá rẻ