MacOSX / Safari / CSS / content: "漢字";

質問

お世話になります。
SafariなどのKHTMLブラウザ（各最新バージョン）にて、
次のCSSを外部スクリプトとして読込むと文字化けします。
HTMLのヘッダ間に埋め込むと、文字化けしません。
//----------------------------
ul li.new:before
{
color: #fff;
background-color: #f00;
font-weight: bold;
margin-right: 1px;
padding: 1px 2px;
content: "新着：";
}
//----------------------------
Safariでは、上手く表示できない仕様なのか、
外部スクリプトの記載方法が、間違ってるのか、
解決策があれば、教えて下さい。
ちなちなみに、Opera、Firefox（共に最新）では、
「新着：」という文字が出来ています。
また、PHPなどでもやってみたのですが、こちらは
ＯＫです。
よろしくお願いします。

回答No.3

BLUEPIXY · ベストアンサー

>外部CSSでは駄目
Safariのバグじゃないでしょうか
FireFoxで試したら、ちゃんと（@charsetで違う文字コードでも）表示できました。
だから、記述自体は問題ないと思います。

お礼

どうも、色々とありがとうございます。
たぶん、そうだと思います。
Safariというか、AppleWebkit（KHTML）の仕様か、バグでしょう。
外部CSSの文字コードを、UTF-8にしたら、Safariでも表示されましたが、
この場合は、FlockやFirefoxなどで逆に文字化けになりました。
英数字を使うか、ヘッダ間に埋め込んだ方が無難ですね。

回答No.2

BLUEPIXY

文字コードを合わせるか
外部ＣＳＳの先頭に
@charset "Shift_JIS";
とか使用文字コードを書く

補足

情報ありがとうございます。
やりましたが、効果無しでした。
Safariで、このCSSをみると、↓
@charset "Shift_JIS";

@charset "Shift_JIS";

ul li.new:before
{
color: #fff;
background-color: #f00;
font-weight: bold;
margin-right: 1px;
padding: 1px 2px;
content: "V
F";
}
と、「新着：」が、「V改行F」と表示されて、ページ上では、
E`V???F こんな風に表示されます。（？の部分は□の中に×印）
埋め込みなら表示されるので、Safariも一応対応しているのでしょうが、
外部CSSでは駄目っていうのが、わかりません。ーー；）

回答No.1

noname#14286

その外部cssの編集文字コードは
htmlと同じですか？

補足

情報ありがとうございます。
外部CSSファイルの文字コードも同じshift_jisだと思います。

質問内容文に一部間違いがありました。
CSS内容をPHPとして行っても駄目でした。
＜？php
header("Content-type: text/css");
ul li.new:before
{
color: #fff;
background-color: #f00;
font-weight: bold;
margin-right: 1px;
padding: 1px 2px;
content: "新着：";　（←これが NEW!などの英数字ならOKです）
}
？＞