2013-07-16 8 views
14

前、後、最初の文字と最初の行の疑似要素には、シングルコロン(:)またはダブルコロン(::)を使用する必要がありますか? MDNから

::表記は、擬似クラスと擬似要素間 識別を確立するためにCSS 3に導入されました。それは古いものと新しいブラウザ上で動作しますので、表記:は常にCSS3ブラウザで受け入れられる場合も2

CSSで導入された表記法:を受け入れる ブラウザは、私はそれを使用する必要がありますか?

または表記:は常に受け付けられませんので、私は、それらの両方、古いブラウザ用:と新しいもののため::を使用する必要がありますか?


:私は私の質問は他の質問は、ALL疑似要素のための二重表記対単一について尋ねるので、重複がShould I use single or double colon notation for pseudo-elements?の重複ではないではないと思います。私の質問は、CSS3で定義されている新しい要素ではなく、CSS2で定義されている擬似要素についてのみですが、私はすでに::を使用する必要があることを知っています。

+0

IE8などの古いブラウザは気になりますか?その場合は、 ':'を使用してください。そうでなければ '::'を使います。 – thirtydot

+2

[疑似要素cssのために単一または二重コロン表記を使用すべきですか?](http://stackoverflow.com/questions/10181729/should-i-use-single-or-double-colon-notation-for-擬似要素-ssss) – thirtydot

+0

@thirtydot http://stackoverflow.com/questions/10181729/should-i-use-single-or-double-colon-notation-for-pseudo-element-cssについては、単一の対ダブル表記について尋ねるすべての擬似要素に対して。私の質問は、CSS2で定義された擬似要素についてのみであり、CSS3で定義された新しい要素ではありません。私が既に '::'を使わなければならないことを私は知っているからです。 – Oriol

答えて

15

を導入された新しい擬似要素、著者はCSS1とCSS2擬似含むすべての擬似要素、のための二重のコロンを使用Selectors 4 now explicitly asks のために許可されていません今後要素、:

をため、従来の制約のために、ユーザエージェントは::before::after::first-line、および::first-letter擬似要素が疑似クラスに似て1つのコロンではなく、2、で書き込むことができるようにする必要があります構文。作者は、これらの擬似要素に対して常に二重コロンの構文を使用する必要があります。

これは、あなたが絶対にレガシーブラウザサポートが必要な場合は、シングルコロン構文ののみ適切な使用が今日であることを意味する - ここで重要な唯一のブラウザはIE8で、古いです。そうでない場合は、二重コロンだけを受け入れるnewer pseudo-elementsとの一貫性のために、二重コロンの構文を使用する必要があります。また、例えば、border-radiusbox-shadowなど、というIE8 でサポートされていないプロパティを::before::after疑似要素に適用する場合は、シングルコロン構文を使用するのは無意味です。

私は非常に少なくともでセレクタ3は、シングルコロン構文は、任意の新しい疑似要素には適用されませんのでその声明の中でこれを暗示が、この種のものは黒で述べたことを信じているしたいと思いますし、白は決して誰にも害を及ぼさず、今後の標準がそうであることを知ることは良いことです。

また、両方の表記を一緒に使用する理由はありません(例::before, :after { ... } ::before, ::after { ... })。古いブラウザをサポートせずに新しい構文をサポートするブラウザは存在しません。


私はそれはおそらく、この質問を頼まれた時にはまだこれを述べるなかったことが、この十分に認識して言う - May 2013 WDは確かにありませんでした。

+0

*とにかくIE8でサポートされていない擬似要素の前にスタイルを適用する場合など、シングルコロン構文を使用することは全く意味がありません。最後のサブセクションはスタイルを指し、疑似要素は指しませんか?文はあいまいです。IE8で前後がサポートされていないかのように読み込むことができます。 –

+0

@Bram Vanroy:そうです、私は明確にするために編集します。 – BoltClock

+0

"*作成者はいつもダブルコロン構文*を使用しなければならない"という文章があるようですが、昨日はCSSWG [解決済み](https://lists.w3.org/Archives/Public/www-style/ 2015Sep/0111。html)を推奨します。 – Oriol

-2

私は単一のために行くだろう: 今や人々は少なくともいくつかの最新のブラウザがインストールされている必要がありますので、心配する必要はありません。

4

私は以前このコメントで述べたように - http://css-tricks.com/html5-progress-element/#comment-533395

短い答え - 利用シングルコロン記法:

ロング回答から:before::before、または:after::afterの間に間には実質的な違いはありません。しかし古いブラウザではコロン記号を1つ使用しているので、:を使うのは常により安全です。この::表記は擬似クラスと擬似要素間の識別を確立するために現在のドキュメントによって導入される

、と述べW3C on pseudo elementsによって定義され、このスペックを読み出します。既存のスタイルシートとの互換性のために、ユーザーエージェントは、CSSレベル1と2で導入された擬似要素(つまり:first-line、:first-letter、:beforeと:after)の前の1コロン表記も受け入れる必要があります。この互換性は、CSSレベルで何が価値がある3.

関連する問題