CSS Background image link

ในการทำให้รูปภาพสามารถ link ได้ ถ้าเขียนโดย xhtml ก็จะเขียนในลักษณะนี้

1

<a href="urllink.html"><img src="logo.jpg" alt="" border="0" /></a>

แต่ถ้าเราเขียนในรูปแบบของ css เรามักจะกำหนดรูปภาพไปอยู่ในส่วนของ css
ซึ่งทำให้เราไม่ได้เขียนให้รูปภาพ link ได้ในรูปแบบเดิมได้ (รูปแบบ xhtml)
แต่ถ้าจะให้รูปภาพ สามารถ link ได้ ขอแนะนำ 1 วิธีการ โดยทำตามนี้

ส่วนของ css

1
2
3
4
5
6
7
8
9
10

 <style type="text/css">
#logolink {
display: block;
height: 100px;
width: 200px;
background-image: url(logo.jpg);
}
 
#bglink span { display: none; }
</style>

ส่วนวิธีเรียกใช้ก็คือ

1
2
3

<p id="logolink">
<a id="bglink" href="urllink.html"><span>Click my logo</span></a>
</p>

จาก
http://www.webdeveloper.com/forum/showthread.php?t=188503

หวังว่าคงทำกันได้นะครับ

Popularity: 100% [?]