Analisis kemerosotan laman web yang elegan berdasarkan kemahiran tutorial Modernizr_html5

Kini, kandungan yang dipaparkan pada halaman web semakin banyak, termasuk beberapa kesan fungsi HTML5 dan CSS3. Jadi jika pelayar pelanggan menyokong HTML5. Akses halaman berfungsi dengan baik tanpa sebarang masalah. Bagaimana jika HTML5 tidak disokong, atau adakah ia IE6, 7, 8 dan pelayar lain? Kali ini sering sakit kepala untuk kakitangan hadapan, keserasian.

Serasi pada masa ini. Ia tidak lebih daripada membenarkan pengguna melihat dan menggunakannya secara konsisten yang mungkin dalam semua pelayar. Tetapi halaman tersebut menggunakan teg HTML5 dan gaya CSS3. Apakah yang perlu saya lakukan jika penyemak imbas klien tidak menyokong HTML5 Untuk masalah ini, kami hanya boleh menyokong seberapa banyak yang kami boleh? Jika anda tidak dapat menyokongnya, sila berikan tip dan cadangan yang mesra. Benarkan pengguna menaik taraf kepada versi penyemak imbas yang lebih baharu. Oleh itu, semasa proses pengekodan, kita perlu melakukan beberapa ujian berfungsi Katakan kita ingin membuat kesan sudut bulat. Menggunakan CSS3, HTML5 sangat mudah.

<gaya>
             artikel   
                                                                                                                                                                                                                ;
                padding: 5px;                                                           lebar
: 350px;                jejari sempadan
:                jejari sempadan:
 1                 bayang-kotak: 4px 4px 10px rgba(0, 0, 0, 0.5)
: 4px 4px 10px rgba(0, 0, 0, 0.5) >            }
            artikel h1 { saiz fon: > 12px
; 
}        gaya ><artikel>
<tajuk><h1>Tajuk sayah1>pengepala>
 <p >Tempat ini adalah kandungannyap>
 artikel>

Kesannya sama seperti yang kita jangkakan

Bagaimana jika penyemak imbas klien tidak menyokong HTML5? Mari ujinya menggunakan alat F12 IE

Nota: Kedua-dua mod penyemak imbas dan mod dokumen mesti dipilih

Kesan halaman sangat kejam dalam pelayar yang tidak menyokong HTML5

Kita mesti menyelesaikan masalah ini. Jadi tidak ada cara, lebih banyak kerja perlu dilakukan untuk pelayar yang tidak menyokong HTMl5. Bagaimana untuk menyelesaikan keserasian kesan sudut bulat itu? Ia mestilah pertimbangan pada pelayar yang tidak menyokong HTMl5. Jika sudut bulat HTML5 tidak disokong, kami menggunakan sudut bulat pihak ketiga js untuk melakukannya. Masalah datang lagi? Bagaimana untuk menilai fungsi sudut bulat itu? Pada masa ini, dia teragak-agak lagi. Adakah terdapat penilaian fungsi js yang lebih cekap, komprehensif dan ringkas untuk HTML5?

http://modernizr.com/ Modernizr ialah pemalam pengesanan ciri HTML5.

Masih kesan sudut bulat atas, diubah suai sedikit

Nota: pie.js ialah pemalam penjuru bulat pihak ketiga

<skrip taip="text/javascript" src="Skrip /modernizr-2.0.6.min.js">skrip>
        <gaya>
            artikel   
            {:
 biru muda;                margin:
 20px;>                padding: 5px
;                                                                                                                                                                                                                        🎜>: 350px ;
                 jejari sempadan: 10px;    >
: 4px 4px 10px rgba(0, 0, 0, 0.5);              }
            artikel h1 { saiz fon:
 12px> 🎜>
 }        gaya>
        <artikel>
             <pengepala><h1>鈢的 🎜>h1>pengepala>              
p>我的内容p>>        artikel
>    <skrip
>         Modernizr.load([{             beban: '

Skrip/jquery-1.6.1.min.js' >,            selesai: fungsi () {
                jikajika
 () {                jikajika!
! window.jQuery) {                    Modernizr.load('Skrip/jquery-1.6.1.min.js
 Modernizr.boxshadow,
tidak: 

'Skrip/PIE.js'
,            panggilan balik: fungsi () {$('Artikel').each(Funktion () {
           PIE.attach(this);
                                 🎜> 

script>

Sehen wir uns den Effekt an: Browser, der HTML5 unterstützt

Als nächstes wird IE7 getestet, ein Browser, der HTML5 nicht unterstützt

Daher ist es sehr praktisch, Modernizr für die Funktionserkennung von HTMl5-Seiten zu verwenden. Aber es gibt immer noch ein Problem? Wenn Sie einen umfangreichen Leinwand-Spezialeffekt erstellen, wie machen Sie ihn kompatibel? Kehren wir an dieser Stelle zum Satz am Anfang zurück: Die Funktion wird herabgestuft, so viel unterstützt, wie sie unterstützt werden kann, und freundliche Tipps geben, wenn sie nicht unterstützt werden kann. Wir hoffen immer noch, dass inländische Benutzer bald auf Browser umsteigen, die HTML5 unterstützen, damit Entwickler nicht so große Probleme haben.