ホームページ >ウェブフロントエンド >ブートストラップのチュートリアル >ブートストラップが IE をサポートしていない場合はどうすればよいですか?
ブートストラップが IE をサポートしていない場合はどうすればよいですか?
- 藏色散人オリジナル
- 2021-02-05 09:12:302796ブラウズ
ブートストラップが IE をサポートしていない問題の解決策: まず、HTML ページの先頭に DOCTYPE ステートメントがあることを確認し、次にリモート アドレスを正しく呼び出し、ブラウザのコンテンツをマークし、最後に確認します。対応する js または css ファイルを変更するだけです。
#この記事の動作環境: Windows7 システム、bootstrap3、Dell G3 コンピューター。
bootstrap には、IE9 より前のブラウザとの互換性の問題があります。この互換性の問題を解決するには、関連する js ファイルを導入し、それに応じて処理する必要があります。ブートストラップがIEに対応していない問題の解決方法を以下の記事で紹介しますので、ご参考になれば幸いです。
まず、HTML ページの先頭に DOCTYPE ステートメントがあることを確認する必要があります。 DOCTYPE は、HTML ドキュメントの解析に使用する HTML または XHTML 仕様の種類をブラウザに伝えます。特に次のことに影響します:
属性とプロパティをマークするための制約ルール
ブラウザのレンダリング モードに影響を与えるレンダリング モードが異なると、ブラウザによる CSS コードの解析や JavaScript スクリプトにも影響します。
DOCTYPE は非常に重要です。現在のベスト プラクティスは、HTML ドキュメントの最初の行に
<!DOCTYPE html>## を入力することです。 # マスターの投稿には、ブートストラップ検索の理由がいくつかまとめられていますが、まず、Bootstrap3 はモバイルデバイスファーストの原則で開発されているため、理由は次のとおりです: 1. リモート アドレスが正しく呼び出されないつまり、IE9 より前の場合は、2 つの特別な js
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> <!--[if lt IE 9]> <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script> <script src="http://apps.bdimg.com/libs/respond.js/1.4.2/respond.min.js"></script> <![endif]-->を呼び出すだけです。しかし、テストしたところ、上記の js ファイルだけを使用するのは不可能であることがわかりました。推奨: "
bootstrap チュートリアル"
2. 呼び出しメソッドが間違っています respond.min.js を参照するために file:// または @import フォームを使用しないでくださいまたは、response.js または css ファイル 3. ブラウザの場合、コンテンツをマークします (メタ タグを使用してブラウザのレンダリング モードを調整します) bootstrap は IE 互換モードをサポートしていません。ブラウザで最新のレンダリング モードを実行するには、次のタグがページに追加されます。<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />IE=edge は最新の IE カーネルの使用を強制することを意味し、chrome=1 はブラウザ プラグイン Google IE6/7/8 およびその他のバージョンの Chrome Frame がインストールされている場合 (ユーザーのブラウザは IE のメニューとインターフェイスのように見えますが、ユーザーが Web ページを閲覧するときは、実際には Chrome ブラウザ カーネルを使用します)、Chrome カーネルは次のようになります。レンダリングに使用されます。このメタ タグの詳細な説明については、StackOverflow の素晴らしい回答を参照してください。英語での e8e496c15ba93d81f6ea4fe5f55a2244 タグの専門的な説明については、
http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge-eを参照してください。文
を追加しました。
<meta http-equiv="X-UA-Compatible" content="IE=9" />そして、カーネル コントロール メタ タグを実行できます。現在の国内の主流ブラウザはデュアルコアであるため、ページのレンダリングにどのコアを使用するかをブラウザに指示するためにメタ タグが追加されます4. IE8 はコンテナーをサポートしません いくつかの属性IE8 はボックス サイズ変更を完全にはサポートしません: border-box は min-width、max-width、min-height、または max-height で使用されます。したがって、ブートストラップ v3.0.1 では、コンテナ クラスは max-width を使用しなくなりました。 5. JS と CSS の導入順序に起因する問題 最初に css を引用し、次に js を引用する必要があります
<link rel="stylesheet" type="text/css" href="bootstrap.min.css" media="screen"/> <script type="text/javascript" src="js/respond.min.js"></script>6. 前後に空行がありますDOCTYPE
<!DOCTYPE html> 这里有空格也不行，要去掉空格7. bootstrap.cssbootstrap2.1.1 を使用している場合は、手動で変更することもできます。navbar-inner{ filter:none} を変更すると問題を解決できます。バージョン 3.0 では、この段落はありません。コード、詳細な紹介についてはリンクを参照してください
http://stackoverflow.com/questions/12460190/bootstrap-navbar-does-not-show-in-ie88. quirks モード (互換モード) の使用Web ページを定義するとき、後方互換モード古いブラウザとの互換性はquirksモードに相当し、「標準モード」は標準モードです。具体的には、先ほどと同じように 8b05045a5be5764f313ed5b9168a17e6 と書きます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">テストしてみましたが、現実的ではありません。 最終的には IE11 でテストに合格しましたが、テストしてみるとIE8 で何かを見つけました。問題はプレースホルダーがサポートされていないことです。IE がプレースホルダーをサポートしている問題を解決する方法は次のとおりです。この記事で引用している jquery は 1.11.1 です。 jquery
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>他の jquery バージョン紹介
<script type="text/javascript" src="js/jquery.placeholder.js"></script>jquery.placeholder.js ファイルのダウンロード アドレス https:/ を引用することでも使用できます。 /github.com/mathiasbynens/jquery-placeholderそしてファイルにコードを追加します
<script type="text/javascript">
$(function () {
// Invoke the plugin
$('input, textarea').placeholder();
});
</script>私がここに関与している場合、または問題がまだ解決されていない場合は、http:// にアクセスしてください。詳細については、hustlzp.com/post/2014/01/ie8-compatibility をご覧ください以上がブートストラップが IE をサポートしていない場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。