图像是指当用户将鼠标箭头放在图像上时链接改变 [英] image refers to a link change when user place mouse arrow over image

问题描述

我有2张图片start.png和start_light.png
我在html中有一个图片引用了这样的链接：

 < a href =start.php> < img src =img / start.png/> < / A> 
  

我只需要将start.png图片更改为start_light.png时

任何想法都可以做到这一点吗？

解决方案

尝试在Google上搜索如何使用：hover 与CSS。

HTML

 < a href =start.php> < img src =img / start.png/> < / A> 
  

CSS

  img {
 background：red; 
 width：60px; 
 height：60px 
} 
 img：hover {
 background：blue; 
} 
  

你也可以看看 fiddle 为例。

编辑

如果您想要更改图片本身，您可能需要将其作为您的CSS。

  img：hover {
 background：url（'img / start_light.png'）; 
} 
  

I have 2 images start.png and start_light.png I have in html an image refers to a link like this:

  <a href="start.php"> <img src="img/start.png"/> </a>

All I want is to make "start.png" image to change to "start_light.png" when user place mouse arrow above image start.png

Any idea which is the best way to do this?

解决方案

Try searching Google on how to use :hover with CSS.

HTML

<a href="start.php"> <img src="img/start.png"/> </a>

CSS

img {
    background:red;
    width:60px;
    height:60px    
}
img:hover{
    background:blue;
}

You can also look at this fiddle as an example.

EDIT

You may want to include this as your CSS if you want to change the image itself

img:hover {
    background:url('img/start_light.png');
}

这篇关于图像是指当用户将鼠标箭头放在图像上时链接改变的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！