css - CSS「!important」が動かないようです

Question

私の CSS には、次の順序でがあります。

B, STRONG
{
    color: #333;
}
A
{
    color: #00ae9d !important;
    border-bottom: dotted 1px #00ae9d;
    text-decoration:none;
}

しかし、リンクを保持すると、灰色に緑色の点が表示されます。太字の項目が濃い灰色になり、リンクされた太字の項目が緑の点で表示されるようにするにはどうすればよいですか? 各ルールをランク付けする方法はありますか?

score 3 · Accepted Answer

動作は、タグを設定している順序によって異なります

<b><a href="#">One</a></b>

と同じではありません

<a href="#"><b>One</b></a>

このjsfiddleを確認してください

score 2 · Accepted Answer

に色を付けるには、<a>LoVeHAteのルールに従う必要があります。

L(link) o * V * (visited)e H (hover)A(active) te

a:link {
 color: #00ae9d;
}
a:visited {
 color: #999;
}
a:hover {
 color: #900;
}
a:active {
 color: #555;
}
a:focus {
 color: #900;
}

もちろん、それらをグループ化することはできますが、同じ順序を維持する必要があります。

a:link, a:visited {
 color: #00ae9d;
}
a:hover, a:active, a:focus {
 color: #900;
}

2 に答える 2