アンカーホバーの背景色がパーセンテージで変化する

Question

私は色々な背景色を持つリンクをたくさん持っています - 質問は、ユーザーがこれらのリンク上を移動すると、 ？私。ホバリングすると背景が10％暗くなります。私が逃げようとしているのは、使用されているそれぞれの色ごとに追加のCSSを指定しなければならない...私のCSSだけでなくマークアップも盛り上げる効果のある方法のようだ。

助けてください。あなたは:hover上の部分的に透明な背景を持つ追加の要素を示すことができ

Answer 1

おかげで、：

http://jsfiddle.net/Sec6D/

rgbabrowsers that support itのために使用されています。他のブラウザでは.pngが使用されます。

a { 
    background: red; 
    float: left; 
    color: #fff 
} 
a span { 
    display: block 
} 
a:hover span { 
    background: url(semi-transparent-black.png); 
    background: rgba(0,0,0,0.2); 
} 

<a href="#"><span>Link 1</span></a>