如何使用来自不同图像文件的一个图标？ [英] How to use one icon from different image files?

问题描述

这里是一个图像文件中的图标集。和此处是

Here is the set of icons within one image file. And here is another set.

如何使用一个文件中的图标创建一个链接（ a href ）

How can I create a link (a href) with usage of icon from one file, on hover it should take icon from another file (the same position) and on click - from third file?

这里是CSS只是使用一个图标：

Here is the CSS just to use one icon:

width: 16px;  
height: 16px;  
background-image: 
url(images/ui-icons_222222_256x240.png); 
background-position: -32px -128px; 

推荐答案

所有你需要做的是定义不同链接的状态：

All you have to do is define styles for the different states of the link(s):

a:link,a:visited { /* for regular non-hovered, non-active link styles */
    width: 16px;  
    height: 16px;
    background-image:
    url(images/defaultStateImage.png); 
    background-position: -32px -128px;
}

a:hover { /* for hover/mouse-over styles */
    url(images/hoverStateImage.png); 
    background-position: -32px -128px;
}

a:active { /* for click/mouse-down state styles */
    url(images/clickStateImage.png); 
    background-position: -32px -128px;
}

这篇关于如何使用来自不同图像文件的一个图标？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！