26

ユーザーがリンクをクリックすると、データベースで既読としてマークされるリンクを表示しています。ユーザーのブラウザ履歴ではなく、データベース情報に基づいて、クリックされたリンクとクリックされていないリンクのスタイルを設定したいと思います。これまでのところ、私が使用するとき：

 10 a:visited {
 11   color: #444;
 12 }
 13
 14 a:link {
 15   font-weight: bold;
 16   color:black;
 17 }
 18
 19 .read {
 20   color: #444!important;
 21 }
 22
 23 .unread {
 24   font-weight: bold!important;
 25   color:black!important;
 26 }

と

<tr class="even">
  <td><a class="read" href="example.com">blah</a></td>
</tr>
<tr class="odd">
  <td><a class="unread" href="example.org">foo</a></td>
</tr>

リンクにアクセスしましたが、このページからではありません（データベースで未読としてマークされています）。奇妙な結果が得られます。たとえば、色だけが機能しますが、重みは機能しません。

競合するときに、あるスタイルが別のスタイルをオーバーライドすることは可能ですか？

ありがとう！

編集：明確にするために更新されたコード

解決

 10 a:link,
 11 a:visited {
 12   font-weight: bold;
 13   color: black;
 14 }
 15
 16 a.read {
 17   color: #444;
 18   font-weight: lighter !important; /* omission or even "normal" didn't work here. */
 19 }
 20
 21 a.unread {
 22   font-weight: bold !important;
 23   color: black !important;
 24 }
4

5 に答える 5

37

！importantディレクティブを使用できます。例えば。

.myClass
{
   color:red !important;
   background-color:white !important;
}

適用されている他のスタイルをオーバーライドする必要がある場合は、上記のように各スタイルの後に！importantを配置します。

于 2009-02-14T21:20:36.420 に答える
8

まず、ブラウザ自体の履歴がスタイルに干渉しないようにする場合は、：visited疑似クラスを使用して非訪問リンクのスタイルと一致させ、DBレコードに基づいて手動でクラスを適用します。

競合するスタイルに関しては、セレクターの特異性がすべてであり、同じプロパティを持つ2つが競合する（同じ特異性を持つ）場合は、最後の1つが「優先」されます。

これを行う：

a:link, 
a:visited {
    font-weight: bold;
    color: black;
}

a.read {
    color: #444;
}
于 2009-02-14T21:28:00.927 に答える
1

試す：

a.unread, a:visited.unread {style 1}

a.read, a:visited.read {style 2}
于 2009-02-14T21:21:36.760 に答える
1

1つは、HTMLをチェックして、リンクに追加されていることを確認class="read"します。class="unread"

2つ目は、CSSルールを追加aしてみてください。.read.unread

a.read { /* ... */ }
a.unread { /* ... */ }

それでも問題が解決しない場合は、の前にスペースを追加してみてください!important。これは必須ではないと思いますが、私が見たほとんどの例にはそれが含まれています。

于 2009-02-14T21:35:35.540 に答える
0

CSSセレクターの特異性を定義できます。

a { /* style 1 */ }

によってオーバーライドされます

div a { /* style 2 */ }

divの親要素はどこですかa

詳細については、Selectutorialをご覧ください。

于 2009-02-14T21:30:02.187 に答える