web-dev-qa-db-ja.com

CSS:コンテンツの文字をエンコードした後

私は次のCSSを使用していますが、これは動作しているようです:

a.up:after{content: " ↓";}
a.down:after{content: " ↑";}    

ただし、出力はリテラルで実際の文字列を示すため、文字はこのようにエンコードされているようには見えません。

a.up:after{content: " ↓";}
a.down:after{content: " ↑";}   

エンコードできない場合、エンコードをサポートしているため、jQueryで.append()などを使用する必要があるように感じます。何か案は?

46
theorise

エンコードされたUnicode文字をcontentで使用するには、文字自体を(あなたがするように)提供するか、HTMLエンティティの代わりにUTF-8エスケープシーケンスを提供する必要があります。

a.up:after { content: " \2193"; }
a.down:after { content: " \2191"; }   
88
BoltClock

とにかくこれらの文字をエンコードしたいのはなぜですか? HTMLではなくCSSを記述していることに注意してください。あなたのコード:

a.up:after{content: " ↓";}
a.down:after{content: " ↑";}

uTF-8エンコードでファイルを保存し、適切なヘッダーを送信する限り、完全に有効です。

Content-Type: text/css; charset=utf-8

エンコード文字はHTMLでのみ使用されるため、コンテンツとタグのあいまいさはありません。したがって、encode< なので &lt;これは、ブラウザがタグの始まりだとは思わないようにするためです。 &darr;は、utf-8の使用方法がわからない(または何らかの理由でできない)人のための単なる商品です。

11
Felix