对于我的 Tumblr 主题,我希望将屏幕右侧的这 4 个固定图像链接到另一个页面。
My Tumblr's link .
这是其中一张图片的 HTML:
<img src="http://i851.photobucket.com/albums/ab71/rachelala101/fandomsbuttons1-1_zps43ab3b55.png" id="icon1" width="90px">
这是它的 CSS:
#icon1 {
display:block;
position:fixed;
right:20px;
top:60px;
z-index:130
}
我尝试使用标签链接它,但随后图像完全消失了。
欢迎来到 StackOverflow,
您应该像您提到的那样使用标记 anchor a
。这是一个工作示例,将 #
替换为您的链接。
<ul>
<li><a href="#"><img src="http://i851.photobucket.com/albums/ab71/rachelala101/fandomsbuttons1-1_zps43ab3b55.png" id="icon1" width="90px" class="icon1_rollover"/></a></li>
<li><a href="#"><img src="http://i851.photobucket.com/albums/ab71/rachelala101/fandoms%20buttons%201-1-2_zpsynh4farl.png" id="icon2" width="90px" class="icon2_rollover"/></a></li>
<li><a href="#"><img src="http://i851.photobucket.com/albums/ab71/rachelala101/fandomsbuttons1-3_zps10c8734d.png" id="icon3" width="90px" class="icon2_rollover"/></a></li>
</ul>
CSS
ul {
list-style: none;
position:fixed;
right:20px;
top:60px;
z-index:130;
}
a {
text-decoration: none;
}
a:hover {
text-decoration:none;
}
您可能想阅读此 tutorial .
顺便说一句,博客不错。
我是一名优秀的程序员,十分优秀!