Kênh 360 Công Nghệ Kênh 360 Công Nghệ

Trang chủ - Thiết kế web - HTML - CSS - Hướng dẫn tạo tootip trong khi rê chuột vào hình ảnh

Hướng dẫn tạo tootip trong khi rê chuột vào hình ảnh

Cách tạo tooltip khi rê chuột vào ảnh thì hình phóng lớn và hiện mô tả.

<a class="thumbnail" href="/cntt/" >
<span><img src="/cntt/" /></span></a>

Tiếp theo vào file css của template dán đoạn css sau vào:
.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{
visibility: visible;
top: 0;
left: 60px;

}
Thiết kế bố cục trang web layout với thẻ div < Lùi   Tiếp theo > Cắt ảnh bằng CSS và HTML
Lần cập nhật cuối ( Thứ sáu, 20 Tháng 3 2009 15:36 )  

Kênh 360 công nghệ

  • Nổi bật
  • Tin mới
  • Game mới
  • PrestaShop Guide
  • PrestaShop

Có thể bạn quan tâm

Download nhiều nhất

11/12
 Download PES 2011 - FIFA 11
693
18/12
 binkw32 dll
175
18/12
 TeamViewerQS
49
English French German Japanese Korean