9

私はこれらの表記法をcssで見つけました:

.nav li ul li a [class*="icol-"] { opacity: 0.5; filter: alpha(opacity=50); padding-top: 4px; }

.secNav .chzn-container { width: 100%!important; max-width: 100%; }

記号の*前の意味は何ですか?シンボル=使用時のコメントですか?!

4

5 に答える 5

13
element[attribute*="includesthis"]

言い換えると:

<a class="someclassicol-hello">Click me and win a free monkey</a>

と一致します

a[class*="icol-"]

文字列が属性のどこかに表示される場合、それは一致です。

^=「で始まる」と$=「で終わる」もあります。詳細については、こちらをご覧ください


!importantルールが相互にオーバーライドされない場合は、ルールを強制的に相互にオーバーライドします。

a { color: red !important }
a.blue { color: blue }

<a class="blue">I'm actually red, because the less specific rule is !important</a>

詳しくはこちらをご覧ください。特にこのビット:

いつ!important使用する必要がありますか?

他のテクニックと同様に、状況に応じて長所と短所があります。では、いつ使用する必要がありますか?これが、潜在的な有効な使用法の主観的な概要です。

一度もない

!important他のすべての手段が使い果たされた後に絶対に必要でない限り、宣言は使用されるべきではありません。怠惰から!importantを使用して、適切なデバッグを回避したり、プロジェクトを急いで完了させたりすると、それを悪用していることになり、あなた(またはプロジェクトを継承する人)はその結果に苦しむことになります。

于 2012-11-23T08:47:11.003 に答える
9

!の一部です!important; コメントではありません。!importantルールが常に適用されるように強制します。これは通常、スタイルをオーバーライドしたり、オーバーライドされないようにするために使用されます。

*=は「含む」という意味です。.nav li ul li aしたがって、この例では、最初の行は「icol-」を含むクラス名を持つ要素のすべての子を探しています。

于 2012-11-23T08:46:35.577 に答える
2

W3の推奨事項から:

[att*=val]

値にサブストリング「val」のインスタンスが少なくとも1つ含まれているatt属性を持つ要素を表します。「val」が空の文字列の場合、セレクターは何も表しません。

したがって、あなたの場合、icol-クラス属性(の子.nav li ul li a)にあるすべての要素と一致します。

于 2012-11-23T08:50:38.403 に答える
2

*=属性セレクターです。CSS3仕様を参照してください

!importantつまり、ルールはスタイルの作成者によって重要であると見なされ、オーバーライドしてはなりません。詳細な説明については、CSS2などを参照してください。

于 2012-11-23T08:52:44.337 に答える
2

周囲の空白~とのみ一致するものと混同しないでください。


[class*="foo"] /* 'fooA bar' */

foo周囲にスペースがある場合とない場合)を含むクラスに一致します

[class~="foo"] /* 'foo bar' */

周囲にスペースfooのみを含むクラスに一致します


もあります:

[class^="foo"] // begins with foo ('fooABC')
[class$="foo"] // ends with foo ('ABCfoo')
[class|="foo"] // begins with foo and is separated by a dash ('foo-bar')

詳細はこちら:複雑なセレクター

于 2016-11-29T20:21:22.160 に答える