最新のものから以前のまで、Bootstrapでサポートされている、各々の既知のクセとためのバグが含まれているブラウザーとデバイスについて学びます。
サポートされているブラウザー
Supported browsers
Bootstrapは、すべての主要なブラウザーとプラットホームの最新の安定したリリースをサポートしています。Windowsでは、私たちは、Internet Explorer 10-11/Microsoft Edgeをサポートしています。
WebKit、BlinkやGeckoの最新バージョンを使用する代替ブラウザは、直接、あるいは、プラットホームのWebビューAPIを経由するかにかかわらず、明確にサポートされていません。しかしながら、Bootstrapは、（ほとんどの場合）これらのブラウザーで、同様に、適切に、表示し、機能する必要があります。より具体的なサポート情報は以下のとおりです。
モバイル機器
Mobile devices
一般に、Bootstrapは、各主要プラットフォームのデフォルトブラウザの最新バージョンをサポートしています。 プロキシ・ブラウザー（例えばOpera Mini、Opera MobileのTurboモード、UCブラウザMini、Amazon Silk）がサポートされていないことに注意して下さい。
| Chrome | Firefox | Safari | Android Browser & WebView | Microsoft Edge | |
|---|---|---|---|---|---|
| Android | Supported | Supported | N/A | Android v5.0+ supported | N/A |
| iOS | Supported | Supported | Supported | N/A | N/A |
| Windows 10 Mobile | N/A | N/A | N/A | N/A | Supported |
デスクトップ・ブラウザー
Desktop browsers
同様に、ほとんどのデスクトップ・ブラウザーの最新版は、サポートされています。
| Chrome | Firefox | Internet Explorer | Microsoft Edge | Opera | Safari | |
|---|---|---|---|---|---|---|
| Mac | Supported | Supported | N/A | N/A | Supported | Supported |
| Windows | Supported | Supported | Supported, IE10+ | Supported | Supported | Not supported |
Firefoxのための、最新の通常の安定版リリースに加えて、また、私たちは、Firefoxの最新の延長したサポート・リリース（ESR）バージョンをサポートしています。
非公式に、Bootstrapは、公式にサポートされないChromiumとChrome for Linux、Linux for FirefoxとInternet Explorer 9で十分に見え、適切に動作するはずです。
Bootstrapが取り組む必要がある、いくつかのブラウザのバグのリストについては、ブラウザのバグの壁をご覧ください。
Internet Explorer
Internet Explorer
Internet Explorer 10+はサポートされています。;IE9とそれ以前は、そうでありません。一部のCSS3のプロパティとHTML5の要素は、IE10では完全にサポートされていないか、完全な機能のためにプレフィックス付きのプロパティが必要であることに注意してください。CSS3とHTML5機能のブラウザー・サポートの詳細のために、訪問して、使用することができます。
あなたが、IE8-9のサポートを必要とする場合、Bootstrap 3を使用してください。これは、コードの中で最も安定したバージョンであり、致命的なバグの修正とドキュメントの変更について、私たちのチームによってサポートされています。しかしながら、新しい機能は、それには追加されていません。
モバイル上のモーダルとドロップダウン
Modals and dropdowns on mobile
オーバーフローとスクロール
Overflow and scrolling
オーバフローのための対応：hidden;<body要素>は、iOSとAndroidでは、かなり制限があります。そのために、あなたが、それらのデバイスのブラウザーのいずれかで、モーダルの一番上や一番下を越えてスクロールするとき、<bodyコンテンツ>は、スクロールし始めます。Chrome bug #175502（Chrome v40で修正された）とWebKit bug #153852を参照して下さい。
OSのテキストフィールドとスクロール
iOS text fields and scrolling
OS 9.2現在、モーダルが開いている間、スクロール・ジェスチャーの最初のタッチが、テキスト<input>や<textarea>の境界内にある場合、モーダルの代わりに、モーダルの下の<body>コンテンツが、スクロールされます。WebKit bug #153856を参照して下さい。
ナビゲーション・バー・ドロップダウン
Navbar Dropdowns
.dropdown-backdrop要素は、zインデックスを付ける複雑さのため、iOSの上のnavでは使用できません。このように、ナビゲーションバーのドロップダウンを閉じるには、あなたは、直接、ドロップダウン要素をクリックする（あるいは、iOSの他の要素で、クリック・イベントを発生する）必要があります。
ブラウザー・ズーミング
Browser zooming
ページの拡大は、必然的に、Bootstrapと残りのWebの両方で、いくつかのコンポーネントでレンダリングの産物を表示します。 問題に応じて、私たちは、それを修正することができる場合があります。（最初に検索し、必要に応じて問題を開いてください）。しかしながら、それらは、多くの場合、ハック以外の回避方法の直接的な解決方法を持っていない傾向があるため、私たちは、これらを無視する傾向があります。
モバイル上の粘着性の:hover/:focus
Sticky :hover/:focus on mobile
実際のホバーが、ほとんどのタッチスクリーンで可能でないにもかかわらず、ほとんどのモバイルブラウザでは、ホバリングのサポートをエミュレートし、次のようにします。：hover "sticky"。言い換えると、:hoverスタイルは、要素を軽くたたいた後、適用を開始します。そして、ユーザーがいくつかの他の要素を軽くたたいたあと、単に適用を停止します。モバイル・ファースト・サイトでは、この動作は、通常は好ましくありません。
Bootstrapには、デフォルトでは無効になっていますが、このための回避方法が含まれています。$enable-hover-media-queryをtrueに設定することによって、Sassからコンパイルするとき、Bootstrapは、ホバーを模倣するブラウザーで、:hoverスタイルを無効にするmq4-hover-shimを使用するでしょう。このように、粘着性の:hoverスタイルを妨げます。この回避方法には、いくつかの注意事項があります。;詳細については、シムのドキュメントを参考にしてください。
印刷
Printing
さらに、いくつかの最新のブラウザーでは、印刷は奇妙なことがあります。
Safari v8.0現在、fixed-width .containerクラスを使用すると、印刷時に、Safariのフォント・サイズが、非常に小さくなることがあります。issue #14868を参照して下さい。そして、詳細に付いては、WebKit bug #138192を参照して下さい。1つの潜在的な回避方法は、次のCSSです：
@media print {
.container {
width: auto;
}
}Androidストック・ブラウザ
Android stock browser
箱から出して、Android 4.1（そして、さらに、いくつかの新しいリリースでも見たところ）は、ブラウザアプリをデフォルトのウェブブラウザとして提供しています。（Chromeとは対照的に）。残念ながら、Browserアプリケーションは、一般的に、CSSに、たくさんのバグと矛盾を持っています。
選択メニュー
<select>要素では、Androidストック・ブラウザは、サイド・コントロールが表示されません。border-radius、および/または、borderが適用されている場合、（詳細については、このStackOverflowの質問を参照して下さい。）Androidストック・ブラウザのスタイル化されていない要素として、問題のあるCSSとレンダリングされた<select>を削除して、以下のコードの抜粋を使用しました。ユーザーエージェントのエラー検出修正は、Chrome、Safari、Mozillaブラウザへの干渉を回避します。
<script>
$(function () {
var nua = navigator.userAgent
var isAndroid = (nua.indexOf('Mozilla/5.0') > -1 && nua.indexOf('Android ') > -1 && nua.indexOf('AppleWebKit') > -1 && nua.indexOf('Chrome') === -1)
if (isAndroid) {
$('select.form-control').removeClass('form-control').css('width', '100%')
}
})
</script>例を見たいですか？このJS Binのデモをご覧ください。
バリデーター
Validators
古いブラウザとバグの多いブラウザに最高の経験を提供するために、Bootstrapは、CSSブラウザのハックをいくつかの場所で使用して、特定のブラウザのバージョンを特定のCSSに限定して、ブラウザ自体のバグを回避します。これらのハックは、CSSバリデータが無効であると文句を言うようになります。2つの場所で、また、私たちは、まだ完全に標準化されていない、最先端のCSS機能も使用していますが、これらは、純粋に、進歩的な強化のために使用されています。
これらの検証警告は、CSSの非ハック部分が完全に検証されているため、実際には問題にはなりません。そして、ハックを行った部分は、ハックを行っていない部分の適切に機能に干渉しません。私たちが故意に、これらの特定の警告を無視する理由です。
私たちのHTML文書には、特定のFirefoxのバグに対する回避策が含まれているため、同様に、いくつかのささいで重要でないHTML検証警告を持っています。
