<style type="text/css">
.ภาพย่อ{
ตำแหน่ง: ญาติ;
ดัชนี z: 0;
} .
ภาพขนาดย่อ:โฮเวอร์{
สีพื้นหลัง: โปร่งใส;
ดัชนี z: 50;
}
.thumbnail span{ /*CSS สำหรับภาพขยาย*/
ตำแหน่ง: แน่นอน;
สีพื้นหลัง: สีเหลืองอ่อน;
ช่องว่างภายใน: 5px;
ซ้าย: -1000px;
เส้นขอบ: 1px สีเทาประ;
การมองเห็น: ซ่อนเร้น;
สี: สีดำ;
การตกแต่งข้อความ: ไม่มี;
}
.thumbnail ขยาย img{ /*CSS สำหรับภาพขยาย*/
ความกว้างของเส้นขอบ: 0;
ช่องว่างภายใน: 2px;
}
.thumbnail:hover span{ /*CSS สำหรับขยายภาพเมื่อโฮเวอร์*/
การมองเห็น: มองเห็นได้;
ด้านบน: 0;
ซ้าย: 60px; /*ตำแหน่งที่ภาพที่ขยายควรชดเชยในแนวนอน */
}
</style>
<a class="thumbnail" href="#thumb"><img src=" " /><br />เรียบง่ายสวยงาม</span></a>
<a class="thumbnail" href="#thumb" ><img src=" " /><br />จริงจัง ไม่จริงเลย หรือว่า?</span></a>