19

私はしばらく検索していて、何人かの人々がそれを機能させているのを見つけました、しかしそれらのどれもコードサンプルを提供しません。

私は彼らの提案を試しましたが、うまくいきませんでした。<meta http-equiv="X-UA-Compatible" content="IE=edge" />提案により、、、respond.jsまたはを追加しようとcss3-mediaqueries-jsしましたが、どれも役に立ちませんでした。

これがjsfiddleです。IE8で表示すると、両方aが表示bされ、ブラウザーの幅に関係なく同じ行に表示されます。

ただし、Chrome、FF、IE9以降で表示する場合は、ブラウザの幅に応じて、異なる行または単一の行に表示されます。

アップデート

一度にそれらの1つ（css3-mediaquery、html5shiv、および応答）のコメントを解除しようとしましたが、いずれもうまくいきませんでした。

<!DOCTYPE html>
<html lang="en">
<head>
    <title></title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/latest/css/bootstrap-combined.min.css" rel="stylesheet">
</head>

<body>

    <div class="container">
        <div class="row">
            <div class="span4">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit.
            </div>
            <div class="span8">
                LOREM IPSUM DOLOR SIT AMET, CONSECTETUR ADIPISCING ELIT.
            </div>
        </div>
    </div>

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="http://netdna.bootstrapcdn.com/twitter-bootstrap/latest/js/bootstrap.min.js"></script>

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

    </script>
</body>

</html>
4

10 に答える 10

31

IE 8は、そのままのメディアクエリをサポートしていません。

この質問とこの質問に基づいて、 css3-mediaqueries-jsやRespondなどの拡張機能を使用する必要があります。

于 2012-12-18T17:21:47.933 に答える
10

基本的にHTML5IE対応スクリプトであるhtml5shivを使用してみてください。これにより、IE 6、7、および8でブートストラップが機能するはずです。これは、次のように直接ホットリンクすることもできます。

<!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<body>要素の前（つまり<head>内）に含める必要があります

于 2013-04-25T19:07:42.070 に答える
8

あなたの問題は、外部ドメインにあるCSSスタイルシートでrespond.jsを使用しようとしています。Respond.jsは、IE6-IE8のメディアクエリを修正します。

https://github.com/scottjehl/Respond#cdnx-domain-setup

Respond.jsは、AJAXを介してCSSの元のコピーを要求することで機能するため、CDN（またはサブドメイン）でスタイルシートをホストする場合は、クロスドメイン通信を有効にするためにプロキシページをアップロードする必要があります。

デモについては、cross-domain/example.htmlを参照してください。

Upload cross-domain/respond-proxy.html to your external domain
Upload cross-domain/respond.proxy.gif to your origin domain
Reference the file(s) via <link /> element(s):

<!-- Respond.js proxy on external server -->
<link href="http://externalcdn.com/respond-proxy.html" id="respond-proxy" rel="respond-proxy" />

<!-- Respond.js redirect location on local server -->
<link href="/path/to/respond.proxy.gif" id="respond-redirect" rel="respond-redirect" />

<!-- Respond.js proxy script on local server -->
<script src="/path/to/respond.proxy.js"></script>

クロスドメインの設定で問題が発生した場合は、respond-proxy.htmlにクエリ文字列が追加されていないことを確認してください。

于 2014-02-19T04:22:27.003 に答える
4

によると：https ：//drupal.org/node/2173441

BootstrapサイトをIE8で動作させるには、次の手順に従う必要があります。

  1. Respond.jsモジュールを使用してRespond.jsファイルをインストールします。
  2. CDNを無効にしてブートストラップファイルをロードします。
  3. Bootstrap Library Moduleを使用して、Bootstrapファイルをローカルにインストールします。
  4. CSSファイルを集約して圧縮する/admin/config/development/performance
于 2014-02-05T10:39:18.743 に答える
2

はい、InternetExplorer8以下のクラス'container'の幅は940pxです。しかし、Internet Explorer9 +、Firefox、Google Chromeなどでは、「contianer」クラスの幅は1170pxと呼ばれています。

同じ問題がZurbFoundationにもあります。

クライアントがIE8<で表示するWebサイトを考慮しないように要求した場合、ブートストラップまたはzurbFoundationRWD機能の実装を開始します

于 2013-06-03T06:41:14.143 に答える
2

これが、Bonesフレームワークで機能する私が取り組んできたソリューションです。ブートストラップで非常に簡単に使用できます。

https://github.com/gamsim/ieresponsify

于 2013-09-27T05:42:49.863 に答える
1

IE8でのCROSSDOMAINcssの読み込みに関する問題は、 @AkshayRajeと@CraigLondonによって提案されたように解決されました。

それに追加するには、セットアップを機能させるために、 respond.proxy.jsの前にrespond.jsまたはrespond.min.jsを追加する必要があります。

于 2014-05-23T07:35:03.300 に答える
1

すべてのスタイルシートの「link」タグの後、headタグclosed（）の直前で、これを試すか、フォローしてください。これは、「head」タグ内の最後を意味します。この形式は、すべてのWebサイトで99％機能します。ただし、一部のdrupalブートストラップテーマでは機能しません。

すべてをウェブサイトのローカルフォルダに保存することを忘れないでください。CDNは使用しないでください。

 <!--[if lt IE 9]>
 <script type='text/javascript' src="/sites/all/themes/bootstrap_subtheme/js/css3-mediaqueries.js"></script> 
 <script type='text/javascript' src="/sites/all/themes/bootstrap_subtheme/js/html5.js"></script>
 <script type='text/javascript' src="/sites/all/themes/bootstrap_subtheme/js/respond.min.js"></script>
 <![endif]-->
于 2014-10-27T10:53:06.037 に答える
1

多くの場合、コンテンツ配信ネットワーク（ oss.maxcdn.comやcdnjs.cloudflare.comなどのCDN）からのメディアクエリ（ブートストラップやその他のファイル）を使用してCSSをロードします。Respond.jsは外部から読み込まれたCSSでは機能しないため、サーバーからBootstrap CSS（またはメディアクエリを含む他のCSS）を読み込む必要があります。

于 2015-04-23T14:48:26.160 に答える
-7

ええ、それはIEをサポートしていません。私はアンチブートストラップではありませんが、ブートストラップフレームワークのcssコードを確認します。そして、他の幅は％として定義されていないことがわかりました。他のブログ記事で、幅に％を使用して応答するようにする必要があることを読みました。これは本当です。

ipadに関して言えば、ブートストラップによってこれに使用されているcssコードは、メディアクエリからのものではなく、メディアクエリ内で宣言されていない通常のcssコードです。そしてそれはあなたがie7と8のために使わなければならない固定幅です（それであなたがブートストラップを使いたいならそれを最初に考えてください。）

将来（またはおそらく今）、ブートストラップがサポートされていない新しいガジェットがある場合。クライアントが戻ってその問題を修正する場合があります。

ie7と8がまだ存在していることは誰もが知っているので、これら2つの古いブラウザーでも機能するはずです。

したがって、私があなたである場合は、サイト/プロジェクトのすべての要件を満たす独自のフレームワークを作成してください。

しかし、私はアンチブートストラップではなく、ただの考えです...私もサイトを開発しているからです。

于 2013-03-06T06:55:27.740 に答える