3

Boilerplate には Respond.js が組み込まれているため、理論的には次の CSS をサポートできるはずです。

@media only screen and (max-height: 580px){.rnd-class{:height:200px !important;}}

FF と Chrome では、期待どおりに機能し、ブラウザ ウィンドウのサイズを変更した後にカスタム スタイルが有効になります。

ただし、IE8 では、現在のブラウザー ウィンドウがどれほど大きくても、カスタム スタイルは常に有効になっています。

問題はコードのどこかにあると考えていましたが、Boilerplate モバイル テンプレートにアクセスしたところ、ブラウザのサイズ変更でもレイアウトが変更され、デフォルトの Boilerplate と同じメディア クエリが使用されていることに気付きました。

ただし、モバイル ボイラープレートでさえ、 FF と Chrome でしか機能しません。IE8 でアクセスすると、メディア クエリが開始されず、最小のデバイス用のバージョンが提供されます。

私の質問は次のとおりです。皆さんは IE8 で同じことを経験していますか? このサイトは IE8 でどのように表示されますか? また、現在のブラウザー ウィンドウのサイズに応じてスタイルが変わりますか?

それとも、おそらく私の特定の IE バージョンに関連していますか? (現在、別の IE バージョンでテストすることはできません)。

そして、もしかしたら、誰か1人がこれに対する解決策を知っているでしょうか?

PS私は現在、HTML5ボイラープレートに付属するデフォルトの「Modernizr」(respond.jsビルドイン付き)スクリプトを使用しています。

4

5 に答える 5

1

はじめに、他のバージョンの IE にはアクセスできないとおっしゃいましたが、 IETesterを見たことがありますか? このツールを使用すると、IE8 がウィンドウ サイズの変更に応じてスタイルを変更しないという同じ動作が見られます。IE9 では、ウィンドウ サイズを縮小するとメイン タイトルのサイズが変更されます。

于 2011-11-23T10:17:09.810 に答える
0

私はrespond.jsで最小の高さと最大の高さのメディアクエリを可能にするパッチを書きました

うまくいけば、すぐに統合されます:https ://github.com/scottjehl/Respond/pull/96

于 2012-01-23T17:05:30.443 に答える
0

http://caniuse.com/css-mediaqueriesによると、メディア クエリは IE8 ではサポートされていません。ただし、カスタム Modernizr を構築し、MQ polyfil (respond.js) を含めて、この (および古い) ブラウザーで MQ を有効にすることができます。

于 2011-11-23T10:04:31.703 に答える
0

JavaScriptを使用せずに修正を見つけました。

私は同じ問題を抱えていますが、メディアクエリが別の .css ファイルに保存されている場合のみです。つまり、それらを html に保存すると、IE8 で動作します。非常に奇妙ですが、何らかの理由で機能します。これは理想的ではありませんが、少なくとも私はそれを回避するので、なぜこれが起こるのか、またはCSSを別のファイルに保存するためにできることを誰かが知っているなら、私に知らせてください!

于 2013-01-12T01:33:57.187 に答える
0

Respond.js は幅指向のメディア クエリでのみ機能します。そのため、max-height では機能しません。私も現在解決策を模索中です。

編集:解決策を見つけました。

http://code.google.com/p/css3-mediaqueries-js/

スクリプト IE8 以下の条件付きでロードします。これで準備完了です。

于 2011-11-30T17:37:55.423 に答える