悬停图片使用CSS

我想为我的“更多”的Blogger按钮创建悬停图像。我想引用：悬停图片使用CSS

<b:if cond='data:post.hasJumpLink'> 
     <div class='jump-link'> 
     <a expr:href='data:post.url' expr:title='data:post.title'><img src='http://3.bp.blogspot.com/-JpvWYCR8FXA/Vp1oL9cD7BI/AAAAAAAAAe4/1PRPh1ASGG8/s1600/extendedreadmore.png'/></a> 
     </div> 
    </b:if>

这个CSS：

.jump-link:hover { 
     background: url('http://1.bp.blogspot.com/-i936l-GupbU/Vp4Z9y7tpAI/AAAAAAAAAgw/lyJYJds5PNc/s1600/readmorerollover.jpg'); 
    }

，但它没有出现。我已经尝试了几种变体，似乎找不到找到解决方案的任何类似主题。

来源

2016-01-19 hadesg

您将无法看到背景图像在页面上的图像我期待。 –

你可以尝试像这个 -

.jump-link:hover { 
 
     background: url('http://1.bp.blogspot.com/-i936l-GupbU/Vp4Z9y7tpAI/AAAAAAAAAgw/lyJYJds5PNc/s1600/readmorerollover.jpg') no-repeat \t ; 
 
    } 
 
    .jump-link:hover img{opacity:0;}

<b:if cond='data:post.hasJumpLink'> 
 
     <div class='jump-link'> 
 
     <a expr:href='data:post.url' expr:title='data:post.title'><img src='http://3.bp.blogspot.com/-JpvWYCR8FXA/Vp1oL9cD7BI/AAAAAAAAAe4/1PRPh1ASGG8/s1600/extendedreadmore.png'/></a> 
 
     </div> 
 
    </b:if>

我希望我帮助您。

来源

2016-01-19 11:32:51

谢谢:)这工作 – hadesg

您正在使用的背景作为一个独立的财产。

你所寻找的是：

.jump-link:hover 
    { 
     background-image: url('http://1.bp.blogspot.com/-i936l-GupbU/Vp4Z9y7tpAI/AAAAAAAAAgw/lyJYJds5PNc/s1600/readmorerollover.jpg'); 
    }

更多信息Here

来源

2016-01-19 11:29:42 twan

悬停图片使用CSS

回答

相关问题