Jika ada kesamaan, saya merasa terhormat, jika dicetak ulang, tolong tunjukkan
Solusi untuk membuat IE6 IE7 IE8 IE9 IE10 IE11 mendukung Bootstrap
Baru-baru ini membuat situs web, Saya selalu merasa bahwa bootstrap sangat bagus, Kali ini saya menggunakan bootstrap3, Chrome, Firefox, Safari, Opera, browser 360 (mode kecepatan), browser Sogou dan browser lain tidak memiliki masalah, Dan di bawah IE8 dan IE11 menemukan bahwa gayanya tidak dapat ditampilkan, Kemudian berbagai Baidu, Akhirnya dengan bantuan posting netizen di Yapeng.com memecahkan masalah, Juga merujuk ke Jaringan Pembelajaran Qianxun Solusinya diringkas sebagai berikut:
Pertama, pastikan halaman HTML Anda dimulai dengan deklarasi DOCTYPE. DOCTYPE memberi tahu browser spesifikasi HTML atau XHTML apa yang akan digunakan untuk mengurai dokumen HTML, yang memengaruhi faktor-faktor berikut:
Batasan pada atribut dan properti tag
Memengaruhi mode rendering browser, dan mode rendering yang berbeda memengaruhi penguraian kode CSS browser dan bahkan skrip Javascrip{filter}t
DOCTYPE sangat penting, dan praktik terbaik saat ini adalah mengetik pada baris pertama dokumen HTML:
<!DOCTYPE html>
Ada beberapa alasan untuk menemukan bootstrap yang dirangkum dalam postingan dewa, pertama-tama, Bootstrap3 dikembangkan berdasarkan prinsip perangkat seluler terlebih dahulu, jadi alasannya mungkin sebagai berikut:
1. Alamat jarak jauh tidak dipanggil dengan benar
Artinya, selama IE9 atau lebih rendah, panggil dua js khusus
<!-- HTML5 Shim dan dukungan Respond.js IE8 untuk elemen HTML5 dan kueri media -->
<!--[jika lt IE 9]>
<scrip{filter}t src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></scrip{filter}t>
<scrip{filter}t src="http://apps.bdimg.com/libs/respond.js/1.4.2/respond.min.js"></scrip{filter}t>
<![endif]-->
Tetapi saya menguji dan menemukan bahwa hanya menggunakan file js di atas tidak layak,
2. Metode panggilan salah
Jangan mereferensikan file respond.min.js atau respond.js atau CSS dalam bentuk file:// atau @import
3. Mengidentifikasi konten browser (menggunakan tag meta untuk menyesuaikan metode rendering browser)
Bootstrap tidak mendukung mode kompatibilitas IE, dan agar IE dapat menjalankan mode rendering terbaru, tag berikut akan ditambahkan ke halaman
IE=edge berarti bahwa kernel IE terbaru dipaksakan, dan chrome=1 berarti bahwa jika plug-in browser Google Chrome Frame untuk IE6/7/8 dan versi lainnya diinstal (yang dapat membuat browser pengguna terlihat masih menu dan antarmuka IE, tetapi pengguna sebenarnya menggunakan kernel browser Chrome saat menjelajahi web), maka kernel Chrome digunakan untuk merender. Untuk penjelasan spesifik tentang tag meta ini, lihat jawaban bagus di StackOverflow, dan <meta>penjelasan bahasa Inggris tentang pakar tag dapat ditemukan di sini
http://stackoverflow.com/questions/6771258/whats-the-difference-if-meta-http-equiv-x-ua-compatible-content-ie-edge-e
Saya menambahkan
<meta http-equiv="X-UA-Compatible" content="IE=9" />
Dan kemudian begitulah
Kernel mengontrol tag meta, karena browser arus utama saat ini di Tiongkok adalah kernel ganda, sehingga tag meta ditambahkan untuk memberi tahu browser kernel apa yang akan digunakan untuk merender halaman
4. IE8 tidak mendukung beberapa properti kontainer
IE8 tidak sepenuhnya mendukung ukuran kotak: border-box digunakan dengan min-width, max-width, min-height, atau max-height. Oleh karena itu, kelas kontainer di bootstrap v3.0.1 tidak lagi menggunakan max-width.
5.JS masalah yang disebabkan oleh urutan CSS diperkenalkan
Anda harus mengutip css sebelum mereferensikan js
<link rel = "stylesheet " type = "text/css " href = "bootstrap.min.css" media = "screen"/>
<scrip{filter}t type="text/javascrip{filter}t" src="js/respond.min.js"></scrip{filter}t>
6. DOCTYPE memiliki baris kosong sebelum dan sesudah
<!DOCTYPE html>
Tidak boleh memiliki spasi di sini, Anda harus menghapus spasi
<html>
7. Anda juga dapat memodifikasi bootstrap.css secara manual
Jika Anda menggunakan bootstrap 2.1.1, memodifikasi navbar-inner{ filter:none} dapat menyelesaikan masalah, jika Anda menggunakan versi 3.0+, tidak ada kode, silakan lihat koneksi untuk detailnya
http://stackoverflow.com/questions/12460190/bootstrap-navbar-does-not-show-in-ie8
8. Gunakan mode quirks
Saat mendefinisikan halaman web, mode yang kompatibel dengan browser lama adalah mode quirks, dan "mode standar" yang sesuai adalah mode standar. Secara khusus, <!DOCTYPE html> ditulis seperti sebelumnya
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
Saya menguji ini, tetapi tidak layak
Akhirnya saya menguji di bawah IE11, tetapi diuji di bawah IE8 dan menemukan masalah bahwa placeholder tidak didukung
Berikut cara mengatasi dukungan IE untuk placeholder
jquery yang direferensikan dalam artikel ini diuji di 1.11.1, dan jquery direferensikan terlebih dahulu
<scrip{filter}t type="text/javascrip{filter}t" src="http://code.jquery.com/jquery-1.11.1.min.js"></scrip{filter}t>
Anda juga dapat menggunakan versi jquery lainnya
Kemudian perkenalkan <scrip{filter}t type="text/javascrip{filter}t" src="js/jquery.placeholder.js"></scrip{filter}t>
jquery.placeholder.js alamat unduhan untuk file ini https://github.com/mathiasbynens/jquery-placeholder
Kemudian tambahkan beberapa kode ke file
<scrip{filter}t type="text/javascrip{filter}t">
$(fungsi () {
Panggil plugin
$('input, textarea').placeholder();
});
</scrip{filter}t>
Jika saya terlibat di sini atau jika masalahnya masih belum terselesaikan, silakan pindahkan http://hustlzp.com/post/2014/01/ie8-compatibility detail lebih lanjut
IE6 di atas, 7, 8, 9, 10, 11, chrome, firefox, safari, opera, browser 360 (mode kecepatan), tes browser Sogou lulus, hanya IE5.5 yang tampaknya tidak layak, singkatnya, masalahnya terpecahkan di sini, semua IE6 jahat - sebut saja kecap
Jika Anda tidak ingin menggunakan jquery.placeholder.js, Anda tidak dapat lagi mendukung implementasi emulasi placeholder di browser
Anda dapat merujuk ke artikel ini untuk http://ju.outofmemory.cn/entry/1595 yang sangat rinci |
Diposting pada 03/08/2016 22.55.23
|
|
|
Tuan tanah