156

JSF は、入力フィールドの ID を に設定していますsearch_form:expression。その要素に何らかのスタイルを指定する必要がありますが、そのコロンはブラウザにとって疑似要素の始まりのように見えるため、無効とマークされて無視されます。とにかくコロンか何かをエスケープする方法はありますか?

input#search_form:expression {
  ///...
}
4

8 に答える 8

133

バックスラッシュ:

input#search_form\:expression {  ///...}
于 2008-09-23T16:52:40.847 に答える
94

コロンの前にバックスラッシュを使用すると、IE の多くのバージョン (特に 6 と 7、その他のバージョン) では機能しません。

回避策は、コロンに 16 進コードを使用することです。これは \3A です。

例：

input#search_form\3A expression {  }

これはすべてのブラウザーで機能します: IE6+ (およびそれ以前の可能性も?)、Firefox、Chrome、Opera などを含みます。これはCSS2 標準の一部です。

于 2009-03-17T23:52:11.037 に答える
11

この記事では、CSS で任意の文字をエスケープする方法について説明します。

現在、そのためのツールもあります: http://mothereff.in/css-escapes#0search%5fform%3Aexpression

TL;DR この質問に対する他のすべての回答は正しくありません。アンダースコア (IE6 がいくつかのエッジ ケースでルールを完全に無視しないようにするため) とコロン文字の両方をエスケープして、セレクターがさまざまなブラウザーで適切に機能するようにする必要があります。

技術的には、コロン文字は としてエスケープできますが\:、IE < 8 では機能しないため、次を使用する必要があります\3a。

#search\_form\3a expression {}
于 2011-06-05T08:56:41.660 に答える
7

バックスラッシュでエスケープできます

input#search_form\:expression {
  ///...
}

CSS仕様から

4.1.3 文字とケース

次の規則は常に保持されます。

CSS の制御下にない部分を除いて、すべての CSS スタイル シートは大文字と小文字を区別しません。たとえば、HTML 属性の「id」と「class」、フォント名、および URI の値の大文字と小文字の区別は、この仕様の範囲外です。要素名は、HTML では大文字と小文字が区別されませんが、XML では大文字と小文字が区別されることに特に注意してください。CSS では、識別子 (セレクターの要素名、クラス、および ID を含む) には、文字 [a-z0-9] と ISO 10646 文字 U+00A1 以降、およびハイフン (-) とアンダースコアー (_) のみを含めることができます。 ; 数字で始めることも、ハイフンの後に数字を続けることもできません。識別子には、エスケープ文字と ISO 10646 文字を数値コードとして含めることもできます (次の項目を参照)。たとえば、識別子「B&W?」「B\&W\?」と表記される場合があります。また "

CSS 2.1 では、バックスラッシュ () 文字は 3 種類の文字エスケープを示します。まず、文字列内では、バックスラッシュとそれに続く改行は無視されます (つまり、文字列にはバックスラッシュも改行も含まれていないと見なされます)。

次に、CSS の特殊文字の意味を無効にします。任意の文字 (16 進数を除く) をバックスラッシュでエスケープして、その特別な意味を取り除くことができます。たとえば、"\"" は 1 つの二重引用符で構成される文字列です。スタイル シートのプリプロセッサは、スタイル シートの意味を変更するため、スタイル シートからこれらのバックスラッシュを削除してはなりません。

第 3 に、バックスラッシュ エスケープを使用すると、作成者はドキュメントに簡単に挿入できない文字を参照できます。この場合、バックスラッシュの後に最大 6 桁の 16 進数 (0..9A..F) が続きます。これは ISO 10646 ([ISO10646]) 文字を表し、その数字はゼロであってはなりません。(CSS 2.1 では、スタイル シートに Unicode コードポイント 0 の文字が含まれている場合に何が起こるかは未定義です。) [0-9a-f] の範囲の文字が 16 進数の後に続く場合、数字の末尾を作成する必要があります。クリア。これを行うには、次の 2 つの方法があります。

スペース (またはその他の空白文字): "\26 B" ("&B")。この場合、ユーザー エージェントは "CR/LF" ペア (U+000D/U+000A) を単一の空白文字として扱う必要があります。"\000026B" ("&B") 実際、これら 2 つの方法を組み合わせることができます。16 進エスケープの後に無視される空白文字は 1 つだけです。これは、エスケープ シーケンスの後の「実際の」スペース自体をエスケープするか、2 倍にする必要があることを意味することに注意してください。

数値が Unicode で許可されている範囲外の場合 (たとえば、「\110000」が現在の Unicode で許可されている最大 10FFFF を超えている場合)、UA はエスケープを「置換文字」(U+FFFD) に置き換えることができます。文字を表示する場合、UA は、「文字の欠落」グリフなどの目に見える記号を表示する必要があります (15.2 のポイント 5 を参照)。

注: バックスラッシュのエスケープは、許可されている場合、常に識別子または文字列の一部と見なされます (つまり、"\7B" は句読点ではありませんが、"{" は句読点であり、"\32" は先頭に使用できます)。 "2" はクラス名ではありません)。識別子「te\st」は、「test」とまったく同じ識別子です。

于 2008-09-23T16:53:30.033 に答える
4

JSF 2,0では、web.xmlファイルをjavax.faces.SEPARATOR_CHARのinit-paramとして使用してセパレータを指定できます。

これを読む：

于 2011-01-24T01:35:14.353 に答える
4

コロンにも同じ問題があり、それらを変更できませんでした (コロンを出力するコードにアクセスできませんでした)。jQuery を使用して CSS3 セレクターでそれらをフェッチしたかったのです。

どなたかの参考になるかもしれないのでここに載せます

input[id="something:something"] jQueryセレクターでうまく機能し、スタイルシートでも機能する可能性があります（ブラウザーの問題がある可能性があります）

于 2010-02-09T11:42:09.840 に答える
-1

IE7 (Firefox も) ではこの形式しか機能しないことがわかり、JSF/Icefaces 1.8.2 を使用しています。

フォーム id=FFF、要素 id=EEE とします。

var jq=jQuery.noConflict();
jq(ドキュメント).レディ(関数() {
jq("[id=FFF:EEE]").someJQueryLibFunction({ jQuery ライブラリ関数のオプションはここに })
});
于 2011-06-03T19:22:48.877 に答える