0

クリックするとスタイルが変わる3つのタブがあります。class="active"タブにタブのコンテンツと同じ背景を与えますが、class="inactive"別の色を使用します。

私の問題はタブのテキストです。CSSで何かがおかしいです。デフォルトの状態は正常にclass="active"見えますが、CSStext-decoration: none !important;に表示され、クリックされたアクティブなタブのテキストが非常に太字になっている（または影になっている）場合でも、非アクティブなタブには下線が引かれています。

私のフィドルを見てください：http：//jsfiddle.net/m8wQM/170/

4

5 に答える 5

2

タグのtext-decoration: none;宣言を明示的に設定する必要があります。a

.ui-btn {
     text-decoration: none; /*nope, no need for !important*/
}

これがあなたのデモの少し機能するバージョンです：小さなリンク。

于 2012-09-06T09:36:31.177 に答える
1

オーバーライドできない理由は、CSS値の計算方法が原因です。

CSSがオーバーライドするかどうかを計算する方法は、セレクターによって構成されます。

 1. ID: 100 points.
 2. Class: 10 points.
 3. Tag name: 1 point.

cssルールをオーバーライドするには、セレクターの計算値が前の値よりも高くなければなりません。

例：

<div id="id" class="class"></div>

#id { background: blue; } - 100 point rule.
.class { background: red; } - 10 point rule.

idのセレクターがはるかに高いため、上記のdivは青色のままになります。

変更をプッシュするために、！importantタグを追加するか、次を追加して.classルールがより高いポイントスコアを達成するようにすることができます。

#parent .class { background: red; } - 110 point rule.
于 2012-09-06T09:42:50.660 に答える
1

これを試して..

#navbar ul li a {
    text-decoration: none;
}

：D

于 2012-09-06T09:36:24.640 に答える
1 
.ui-btn {text-decoration: none;}

！importantを追加する必要はありません

于 2012-09-06T09:37:20.560 に答える
1

いくつかのcssを追加しただけで、うまく機能しています。

#navbar ul li a
{
  text-decoration: none !important;  
  text-shadow: none !important;
}

(いずれにしても不要なため、アクティブおよび非アクティブから削除text-decorationします)

これを見てください：フィドル

于 2012-09-06T09:35:04.020 に答える