Mengapa IE8 Memaparkan Versi Mudah Alih Twitter Bootstrap 3 pada Desktop, dan Bagaimana Saya Boleh Membetulkannya?

IE8 Dengan Twitter Bootstrap 3

Dalam halaman web ini, kami akan meneroka isu penggunaan Twitter Bootstrap 3 dengan penyemak imbas IE8.

Isu IE8 Penerangan

Pengguna yang dipersoalkan menghadapi isu semasa menggunakan Twitter Bootstrap 3 dalam tapak web. Walaupun tapak web berfungsi dengan baik dalam semua penyemak imbas lain yang diperlukan, IE8 memaparkan elemen daripada versi mudah alih Bootstrap, merentangi skrin penuh desktop.

Pengguna mengenal pasti masalah itu sebagai IE8 yang mengutamakan reka bentuk mudah alih di Twitter. Bootstrap. Selain itu, sifat CSS lebar maksimum tidak ditarik masuk oleh kelas kontena seperti yang dimaksudkan.

Penyelesaian

Untuk menyelesaikan isu ini, pengguna perlu menggunakan perpustakaan respond.js, yang membolehkan sokongan pertanyaan media dalam IE8. Ini kerana Bootstrap memerlukan sokongan pertanyaan media untuk berfungsi dengan betul.

Langkah-Langkah untuk Melaksanakan Penyelesaian

1. Sertakan baris berikut dalam bahagian kepala dokumen HTML anda:

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

2. Ganti "path/to/respond.min.js" dengan laluan sebenar ke pustaka respond.min.js.
3. Sebagai alternatif, masukkan CSS berikut dalam bahagian kepala untuk menyasarkan IE8 dan ke bawah:

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

4. Selain itu, anda boleh menggunakan salinan setempat fail bootstrap.css dan bukannya memautkannya daripada CDN, sebagai respond.js hanya berfungsi untuk fail setempat.

Maklumat Tambahan

• Untuk rujukan lanjut, lawati: https: //getbootstrap.com/getting-started/#support, khususnya bahagian pada sokongan IE8 menggunakan respond.js.
• Lihat: https://github.com/scottjehl/Respond untuk mendapatkan maklumat lanjut tentang pustaka respond.js.

Atas ialah kandungan terperinci Mengapa IE8 Memaparkan Versi Mudah Alih Twitter Bootstrap 3 pada Desktop, dan Bagaimana Saya Boleh Membetulkannya?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!