1

ie8 からのトラフィックは依然として多くありますが、レスポンシブ ルートを選択することにしました。過去に ie8 でメディア クエリが動作するようになりましたが、最新のテンプレートではうまくいきませんでした。

HTML head タグでの CSS/viewport の設定:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" media="screen" href="/request/css/bootstrap.css">
<link rel="stylesheet" media="screen" href="/request/css/bootstrap-responsive.css">
<link rel="stylesheet" media="screen" href="/request/css/styles.css">

<script src="http://www.oursite.com/js/modernizr.custom.2.6.2.js"></script>
<!--[if (lt IE 9) & (!IEMobile)]>
      <script src="http://www.oursite.com/js/respond.min.js"></script>
<![endif]-->

メディア クエリの構文 (ブートストラップを使用):

@media (max-width: 767px) { }

これは過去に機能していたことを誓いますが、現在は機能していません。私たちは、modernizr のカスタマイズで他のさまざまなポリフィルを試し、modernizr の代わりに html5 shiv を試し、メタ ビューポートの設定を調整し、別のメディア クエリ構文 (@media screen...) を試しました。私はhtmlをトリプルチェックし、検証しました。ブートストラップの行流体を使用していますが、適切にセットアップする必要があります。私はアイデアが不足しています。ヘルプ？

4

1 に答える 1

0

プレス サイトでブートストラップを使用しましたが、IE8 では機能しませんでした。css3-mediaqueries.js javascript を使用しましたが、まだ機能していません。メディア クエリをこの JavaScript ファイルで動作させたい場合は、css のメディア クエリ行に screen を追加します。

ここに例があります：

<script type="text/javascript" src="css3-mediaqueries.js"></script>

<style>
     @media screen and (max-width:900px) {}
     @media screen and (min-width:900px) and (max-width:1200px) {}
     @media screen and (min-width:1200px) {}
</style>
于 2013-08-31T10:09:18.687 に答える