我试图在悬停时获取链接,以显示链接左侧的图像。我已经达到了我想要的几乎减去我有一个HTML问题。
尝试让我的redtext类显示在具有翻转效果的链接上的反斜杠。
有没有办法实现这个或更好的方法?问题中的链接是yaya Photography
CSS
.thumbnail{
position: relative;
z-index: 0;
}
.thumbnail:hover{
background-color: transparent;
z-index: 50;
}
.thumbnail span{
position: absolute;
left: -1000px;
visibility: hidden;
color: black;
text-decoration: none;
}
.thumbnail span img{
border-width: 0;
padding: 0px;
}
.thumbnail:hover span
visibility: visible;
top: -25px;
left: -125px;
}
这是我努力开始工作的HTML
<a class="thumbnail" href="#accordion"><h3><span class="redtext">/</span> yaya Photography</h3><span><img src="images/yaya/yayathumb.png" /></span></a>
提前致谢!
答案 0 :(得分:1)
您的问题是span
上的样式也会影响class="redtext"
范围。
解决此问题的一种简单方法:您可以摆脱span
周围的img
,然后将CSS中span
的引用更改为引用img
代替。