私は私のページで2つのcssファイルを持っています私のページで次のようなリンクがあります：なぜこのCSSはこの他のものを上書きしていますか？</p> <ol> <li>Site.css</li> <li>jqueryの-ui.css</li> Site.cssはjqueryの-UIのCSSの下に表示され </ol> <p></p> <p>I：
<a class='closeClueTipLink'>close</a>
問題は、通常の青いテキストの代わりにnkが黒く表示されています。私は理由を把握するために放火犯を使用する場合、私はこの参照してください。.ui-ウィジェットコンテンツは（カラー＃222222を有する）.closeClueTipLinkをオーバーライドしている理由
を私は理解していませんsite.cssがjqueryの下にあるとします（色は青です）。
この発注はなぜ起こっているのですか？
を[推奨されません]：
.ui-widget-content a
.closeClueTipLinkが後でスタイルシートで発見されていても、.closeClueTipLinkよりそれがよりspecific作ります。
同じタイプのセレクタを他のルールに追加すると、a.closeClueTipLinkとなり、両方のセレクタを同じように（1つのタイプと1つのクラス）作ることができます。その後、定義されてロードされたルールが適用され、リンクテキストが青色になります。
.closeClueTipLinkの後に
.ui-content-content a { }がロードされているためです。
site.cssの後にはjquery...tom.cssがロードされていると確信しているので、後で定義されたスタイルは以前に定義されたスタイルを上書きします。
.ui-content-content a.closeClueTipLink!importantのようなセレクタ： あなたはこの問題を修正している方法があります。 color: #222 !important;aセレクタがちょうど.ui-widget-content後がありますので
クイックフィックス：それはSpecificity [details]に関係している
：
a.closeClueTipLink {
説明：
"" あなたのクラスセレクタの前に追加します。
.ui-widget-content aは、クラスを参照するだけでなく、クラスと要素を参照するため、より具体的です。したがって、.ui-widget-content aは、コードの場所/配置に関係なく、あまり具体的でないものを上書きします。
セレクタの前に "a"を追加すると、要素とクラスを参照するようになります。したがって、それほど特異性が低くなり、場所を使用して決定します。
例：
/* css */
div p { color: red; }
p { color: blue; }
<!-- html -->
<div><p>Text</p></div>
第CSS項目が第二のより特異的であるため、上記の段落のテキストは、赤色あろう。
.ui-widget-content aので、それは彼らが中に配置されているどのような順序に関係なく、それをオーバライドしません.closeClueTipLinkより具体的である。
変更、それは特異性のために
a.closeClueTipLink
+1を読むために。しかし、あなたは問題を解決していません。 – Curt
唯一のことが尋ねられているので、私は「なぜ」に最初に答えることにしました。とにかく私は解決策に取り組んだ。 – BoltClock
100kおめでとうございます！ – thirtydot