根据内容将图像附加到链接

Question

我有一个系统,可以生成指向应用程序不同部分的链接.我需要根据链接的上下文在链接旁边添加一个图像.在CSS中,我会这样做:

a {    
 color:#FF6600;
 padding-right:50px;
 background-image: url('images/system.png');
 background-position: right;
 background-repeat: no-repeat;

}

上面的CSS规则的问题是所有链接都获得相同的图像.如果链接有class ="system",则必须附加system.png,如果得到class ="actions",则必须附加action.png.我猜我可以使用jQuery来做这个,任何指针？

Answer 1

a {
    color: #f60;
    padding-right: 50px;
    background-position: right;
    background-repeat: no-repeat;
}

a.system {
    background-image: url("images/system.png");
}

a.actions {
    background-image: url("images/actions.png");
}