Cara Mengurus Ketidaksesuaian Penyemak Imbas untuk Pemrograman HTML5 dan CSS3 - monyet

Walaupun semua penyemak imbas moden mengurus CSS3 dengan baik pada hari ini, Internet Explorer (terutamanya versi terdahulu) adalah terkenal kerana melakukan perkara-perkara dengan cara yang tidak standard. Berikut adalah beberapa helah untuk membantu anda menghadapi ketidakcocokan.

Cara membuat kod khusus Internet Explorer

Ini sedikit lebih mudah bagi anda untuk melihat bagaimana komen bersyarat berfungsi dengan melihat contoh mudah dan kemudian melihat cara menggunakan helah komen bersyarat untuk memperbaiki masalah ketidakcekapan CSS.

Berikut ialah halaman mudah dengan Firefox.

Di sini ia dipaparkan di IE 7.

Lihatlah kod untuk IEorNot. html dan lihat bagaimana ia berfungsi.

IEorNot. html
Saya kini akan menggunakan komen bersyarat untuk menentukan penyemak imbas anda. Saya akan memberitahu anda jika anda menggunakan IE.









Anda menggunakan IE

Satu-satunya bahagian yang baru adalah komen aneh:


Anda menggunakan IE

Komen bersyarat adalah ciri khas yang terdapat hanya di Internet Explorer. Mereka membenarkan anda menggunakan ujian ke pelayar anda. Anda boleh meletakkan mana-mana kod HTML yang anda inginkan dan 






Oleh itu, apabila anda melihat apa yang Browser dalam IE, ia melihat komen bersyarat, mengatakan kepada dirinya sendiri, "Mengapa ya, saya Internet Explorer," dan memaparkan tajuk "Menggunakan IE". Jika anda melihat halaman yang sama dengan Firefox, penyemak imbas tidak memahami komen bersyarat tetapi melihat komen HTML (yang bermula dengan 

Cara menggunakan komen bersyarat dengan CSS
Komen bersyarat sendiri tidak begitu menarik, tetapi mereka boleh menjadi alat yang sangat berguna untuk mencipta CSS yang serasi. Anda boleh menggunakan ulasan bersyarat untuk membuat dua helaian gaya yang berbeza, satu yang berfungsi untuk IE dan satu yang berfungsi dengan segala yang lain.

Kebanyakan pelayar akan membaca helaian gaya standard yang mencipta latar belakang kuning.

Jika halaman diberikan dalam IE, ia menggunakan helaian gaya kedua.
Lihatlah kod itu, dan anda akan melihatnya sangat mirip dengan IEorNot. halaman html.
WhatBrowser. html Halaman ini mempunyai latar belakang merah di IE, dan latar belakang kuning di pelayar lain.


Jika anda mahu halaman menggunakan gaya yang berbeza dalam IE dan penyemak imbas lain, lakukan yang berikut:


Tentukan gaya lalai terlebih dahulu.
Mulailah dengan mencipta gaya yang akan berfungsi di kebanyakan penyemak imbas. Kebanyakan masa, gaya ini juga akan berfungsi di IE. Anda boleh membuat gaya di peringkat halaman (dengan pasangan) atau luaran (dengan tag).


Buat komentar bersyarat di tajuk.
Buat komentar bersyarat selepas gaya utama, seperti yang ditunjukkan dalam coretan kod ini.



Bina gaya IE yang khusus dalam komen.
Gaya di dalam komen akan digunakan hanya untuk penyemak imbas IE, seperti dalam baris berikut:
body {background-color: red; warna: kuning;} 


Gaya komen boleh menjadi tahap halaman atau luaran.
Seperti gaya lalai, anda boleh menggunakan pasangan untuk membuat gaya peringkat halaman, atau anda boleh menggunakan tag untuk menarik dalam lembaran gaya luaran yang ditentukan.


Hanya kod tempat yang menyelesaikan masalah IE dalam gaya bersyarat.
IE akan membaca kod dalam kedua-dua gaya, jadi tidak perlu mengulang segala-galanya. Gunakan gaya bersyarat untuk hanya kawasan-kawasan di mana IE tidak melakukan apa yang anda harapkan.


Jangan lupa untuk menamatkan komen bersyarat.
Jika anda meninggalkan hujung ulasan bersyarat anda, kebanyakan halaman anda tidak akan muncul. Itu boleh jadi buruk.



Memeriksa versi Internet Explorer
Anda boleh menentukan versi IE yang anda gunakan. Ini penting dengan CSS kedudukan kerana IE versi 7 dan seterusnya berfungsi dengan baik dengan kod mematuhi piawaian, tetapi versi terdahulu tidak. Anda boleh menggunakan variasi ini untuk menentukan kod sahaja untuk IE 6 dan lebih awal.
… <[endif] →


Cara menggunakan tetapan semula CSS
Walaupun penyemak imbas bersetuju dengan elemen CSS yang dimasukkan, mereka kadang-kadang berbeza pada butiran sebenar. Contohnya, mereka boleh memilih margin dan padding yang berbeza untuk elemen senarai. pemaju web sering menggunakan gaya CSS khas yang dipanggil reset CSS .
Ini hanyalah fail CSS luaran yang secara eksplisit menentukan butiran setiap elemen tunggal. Apabila anda menggunakan tetapan semula CSS, anda mungkin tidak terkejut dengan perbezaan antara penyemak imbas. Beberapa pengaturcaraan besar tersedia untuk digunakan secara percuma dari cssreset. com.






Walaupun halaman semula adalah satu rahmat untuk pereka, mereka memperlambat beban halaman dan masa rendering sedikit. Anda tidak boleh menggunakan tetapan semula halaman sebagai satu-satunya CSS, tetapi ubah suai untuk memenuhi keperluan khusus anda. Juga, anda akan mendapati bahawa pengaturcaraan tidak kritikal sehingga anda khawatir bahawa perkara berfungsi dengan sama pada setiap penyemak imbas.