0

これはデモ Web サイトです: http://reddledemo.wordpress.com (いいえ、これは WordPress 関連の質問ではありません。)

私が気付いたのは、Internet Explorer (IE9 でテスト済み) を除くすべての最新ブラウザー (基本的に Chrome、FireFox、Safari、Opera の最新バージョン) で、ページのコンテンツが「サンセリフ」フォント ファミリーで表示されることです。

「body」タグには定義済みのフォントがあり、メニューと「p」段落がスタイルを継承するときに自動的に適用されます。しかし、与えられた例では、これは起こっていません。

CSS を見ると、何かが完全に欠落していない限り、明らかな問題は見られません。それで、それは何でしょうか?(このようなバグに遭遇したのはこれが初めてです。)

4

2 に答える 2

4

これはばかげているように聞こえるかもしれませんが、Internet Explorer 9は、そのファミリ(古いバージョンのIE)でrem別名font-size値をサポートする唯一のブラウザであり、を使用する場合はCSSプロパティroot emをサポートしません。fontrem

したがって、

font: 1.3rem Verdana, sans-serif;

スタイルシートでは、次のように表示する必要があります。

font-size: 1.3rem;
font-family: Verdana, sans-serif;

言うまでもなく、これはremいくつかの最新のブラウザーでのみサポートされており、IE 9はその1つです(このバグを除く)。

概念実証(IE9を使用):

これが役立つことを願っています:D

于 2012-04-24T04:23:42.583 に答える
1

IE 9 はこのrem単位を一般的にサポートしていますが、font省略形ではサポートしていません。デモ:

<!doctype html>
<style>
p { font: 1.35rem Courier; }
</style>
<p>Hello world

IE 9 は、既定のフォント サイズと既定のフォント ファミリを使用して、ルール全体を無視します。そのため、解析ルーチンに明らかにバグがあり、remここで認識されていないものとして扱われるため、ルールを破棄します。

省略形の CSS ルールを 2 つのルールに分割すると機能します。

p { font-size: 1.35rem; font-family: Courier; }
于 2012-04-24T05:06:40.920 に答える