翻转图像超链接到成为一个文本行

Question

我发现这个有用HTML作为问题的答案约翻转图像由renocor（rollover a text hyperlink to become an image）为文本

<style> 
.changeable img 
{ 
    display:none; 
} 
.changeable:hover span 
{ 
    display:none; 
} 
.changeable:hover img 
{ 
    display:inline-block; 
} 
</style> 
<a href="http://www.example.com" class="changeable"><span>Hyper Text</span><img src="img.png" /></a> 

但我需要实现相反的效果。所以我倒转跨度与图像部分工作。这意味着，而不是图像，我看到的文字，但问题是，图像不会消失，但转移正文下方。

有什么建议吗？ 感谢

.changeable span 
{ 
    display: none; 
} 
.changeable:hover image 
{ 
    display: none; 
} 
.changeable:hover span 
{ 
    display: inline-block; 
} 
</style> 
<a href="http://www.example.com" class="changeable"><span>Hyper Text</span><img src="img.png" /></a> 

Answer 1

检查<style>，把IMG而不是图像，为我工作。

.changeable:hover img 
{ 
display: none; 
}