為什麼 IE8 在桌面上顯示 Twitter Bootstrap 3 的行動版本，如何修復？

IE8 與 Twitter Bootstrap 3

在此網頁中，我們將探討在 IE8 瀏覽器中使用 Twitter Bootstrap 3 的問題。

IE8 問題描述

相關使用者在網站中使用 Twitter Bootstrap 3 時遇到問題。雖然網站在所有其他必需的瀏覽器中都能正常運作，但 IE8 顯示了行動版 Bootstrap 中的元素，並在桌面的整個螢幕上延伸。

使用者將問題確定為 IE8 在 Twitter 中支援行動優先設計引導程式。此外，容器類別未如預期引入 max-width CSS 屬性。

解決方案

要解決此問題，使用者需要利用respond.js 函式庫，該函式庫在IE8 中啟用媒體查詢支援。這是因為 Bootstrap 需要媒體查詢支援才能正常運作。

實作解決方案的步驟

1. 在HTML 的 head部分document:

<!--[if lt IE 9]>
  <script src="path/to/respond.min.js"></script>
<![endif]-->

2. 將「path/to/respond.min.js」替換為respond.min.js庫的實際路徑。
3. 或者，在head 部分包含以下CSS 以針對IE8 並下面：

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .container {
    max-width: none;
  }
}

4. 此外，您可以使用bootstrap.css 文件的本地副本，而不是從CDN 連結到它，因為respond.js 僅適用於本地檔案。

額外資訊

• 如需進一步參考，請造訪：https://getbootstrap.com/getting- started/#support，特別是有關使用respond.js 的IE8 支援的部分。
• 有關 respond.js 庫的更多信息，請參閱：https://github.com/scottjehl/Respond。

以上是為什麼 IE8 在桌面上顯示 Twitter Bootstrap 3 的行動版本，如何修復？的詳細內容。更多資訊請關注PHP中文網其他相關文章！