css - mvc html.actionlink css クラス

Question

a:link の継承されたスタイルを上書きするクラスを取得できないようです

@Html.ActionLink("Back to List", "Index", null, new { @class = "htmlactionlink" })

CSS

a:link, a:visited,
a:active, a:hover 
{
    color: #333;
}

.htmlactionlink {
    color: red;
}

要素のスタイルに影響しませんか?

インラインスタイルを適用すると、機能します。

score 3 · Accepted Answer

答えは、CSS を理解することです: 6.4.3 Calculating a selector's specificity。小エキス

セレクターの特異性は次のように計算されます。

他の言葉:

ポイント 3. は、優先度の同じ値がクラスと疑似クラスに適用されることを示しています(詳細は w3schools.com を参照してください)。

つまり、その計算

a:link is { a=0, b=0, c=1, d=1}

その間

.htmlactionlink is { a=0, b=0, c=1, d=0}

a:linkクラスに1ポイント、要素名に1ポイントかかるため、ステートメントが優先されるのはそのためです。

ノート：

私の観点から、最も正しい解決策は

.htmlactionlink:link, .htmlactionlink:visited ... {
    color: red;
}

その場合、{ c=2 , d=0} を取得します。単純な{c=1, d=1}のように順序をカウントしません。A.htmlactionlink

score 0 · Accepted Answer

試す

a:link, a:visited,
a:active, a:hover 
{
    color: #333;
}

a.htmlactionlink 
{
    color: red;
}

2 に答える 2