Ringkasan Pengalaman Pengembangan Cross-Browser (i) Tagging HTML

Karena browser yang berbeda memiliki interpretasi yang berbeda dari tag dan lembaran gaya, perlu untuk menentukan jenis dokumen standar untuk file HTML, sehingga browser yang berbeda dapat menguraikan dan membuat halaman sesuai dengan standar HTML terpadu.

! Doctype menyatakan DTD yang sesuai dengan dokumen yang ditentukan, seperti:

<! Doctype html public -// w3c // dtd html 4.0 transisi // en http://www.w3.org/tr/html4/loose.dtd>

<! Doctype html public -// w3c // dtd xhtml 1.0 transisi // en http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd>

Menggunakan tabel untuk tata letak dapat dengan mudah menyebabkan redundansi kode, dan dibandingkan dengan </Div> menulis, ada banyak kode. Selain itu, tabel perlu mengunduh semua elemen dan menampilkannya, dan halaman web yang sesuai juga lambat untuk dibuka.

Struktur halaman standar harus digunakan: Div+CSS. Metode tata letak ini sederhana dalam kode, kecepatan penelusuran halaman cepat, dan tata letak halaman yang fleksibel. Saat revisi, Anda hanya perlu mengubah gaya CSS untuk mewujudkan relay halaman tanpa mengubah program, sehingga mengurangi biaya revisi situs web.

Terkadang akan ada kosong ekstra pada halaman, yang tidak dapat dihindari bahkan jika margin diatur ulang. Pada saat ini, mungkin label elemen halaman ditutup dan tidak ada pasangan, seperti:

<Div class = Outer>

<Form name = TestForm>

<Div class = Inner>

<Input Name = Judul Tipe = Teks />

</form>

</div>

</div>

Bahkan jika tabel tidak menampilkan elemen TBody yang ditentukan, browser akan berpikir bahwa simpul induk dari node TR adalah simpul TBody default yang ditambahkan secara otomatis. Untuk menghindari kemungkinan kesalahpahaman saat memanipulasi node TR menggunakan JavaScript, lebih baik menambahkan satu secara manual, seperti:

<tabel id = mytable>

<tbody id = mytablebody>

<tr>

<td>

</td>

</tr>

</tbody>

</boable>

Terkadang, beberapa peristiwa terikat pada elemen merespons di browser IE, tetapi tidak di Safari atau browser lainnya. Pada saat ini, Anda perlu memeriksa kebenaran metode pengikatan acara. Ikatan peristiwa lanjutan harus berbeda dari IE dan browser lainnya untuk menulis dua set JavaScripts, sementara model acara sederhana perlu memperhatikan kasus nama acara yang mengikat. menyukai:

<input type = name teks = kata kunci penelitian onfocus = clearvalue ()>

Onfocus kecil harus digunakan di sini, dan metode penulisan standar adalah simbol penutupan tag yang ditambahkan yang ditampilkan.

<input type = name teks = KeyWordSearch onFocus = clearValue () />

Bahasa dan ketik properti dari tag <script>

Atribut bahasa dari tag <script> digunakan untuk menentukan versi bahasa skrip. Tugas yang benar harus seperti <script> untuk memberi tahu browser (terutama IE) untuk menggunakan sintaks JavaScript dari versi 1.2 untuk menjelaskan; Atribut Type digunakan untuk menentukan jenis skrip, ini adalah atribut standar W3C, dan menggunakan atribut kecil adalah praktik standar sesuai dengan standar. Jika Anda tidak perlu memberi tahu browser untuk menjelaskannya dalam versi yang lebih rendah dari bahasa JavaScript (versi JavaScript saat ini yang didukung oleh sebagian besar browser adalah 1,5), Anda umumnya tidak perlu mendefinisikan atribut bahasa, tetapi atribut tipe perlu ditentukan. Jadi kodenya seharusnya

Meskipun nilai -nilai dari dua atribut ALT dan judul ditampilkan dalam bentuk ujung pahat saat melayang di mouse di IE, masih ada perbedaan antara keduanya. Alt adalah tampilan alternatif ketika gambar tidak ditampilkan, dan judul adalah prompt ketika mouse ditempatkan di atasnya.

Dalam versi HTML sebelumnya, tidak wajib bahwa semua atribut harus diberi nilai. Saat mewakili kotak centang, metode penulisan <input checked> diakui. Namun, menurut standar XHTML, tata bahasa seperti itu bukan format XML yang ketat. Perhatikan penugasan atribut dan penutupan tag agar sesuai dengan tren pengembangan standar HTML. Itu ditulis sebagai berikut:

Untuk alasan yang sama dengan artikel sebelumnya, properti yang dipilih dari tag <pection> di opsi <Colly> juga harus diberi nilai:

<opsi dipilih = dipilih />

Menurut standar XHTML, tag HTML harus fokus pada representasi konten, daripada kontrol gaya, dan gaya harus diserahkan kepada CSS untuk menyesuaikan. Oleh karena itu, beberapa tag dan atribut lama dibuang, seperti tag <em> dan <i> tag yang akan membuat karakter Cina dalam huruf miring muncul dalam huruf miring, tetapi <i> tag, hanya dinamai sesuai gaya, sudah menjadi standar yang ditinggalkan, dan digantikan oleh tag <em> yang mewakili makna penekanan. Demikian pula, atribut align = absmiddle dari tag <mmg> menunjukkan bahwa gambar berpusat secara vertikal dan disejajarkan dengan teks yang berdekatan. Ini juga merupakan atribut yang mewakili gaya. CSS harus digunakan sebagai ganti atribut ini untuk mengontrol gaya penyelarasan gambar untuk menghindari pengaruh timbal balik dari dua kontrol gaya.

Saat menggunakan IFRAME, Anda tidak boleh menampilkan batas iframe dengan mengatur perbatasan = 0 di IE, tetapi atribut batas jendela bingkai kontrol standar adalah Frameborder. Anda harus mengatur frameborder = 0 untuk menyembunyikan perbatasan bingkai di browser lain di luar yaitu:

<iframe frameborder = 0 />

Atribut ini, seperti atribut align dari tag <mmg>, juga merupakan atribut yang mengatasi tanggung jawab HTML untuk mewakili konten dan kontrol gaya. Ini menentukan ruang antar unit. Dari sudut pandang praktis, yang terbaik adalah tidak menentukan cellpadding, tetapi menggunakan CSS untuk mengontrol margin dalam sel.

NowRap adalah atribut yang menunjukkan bahwa konten tidak membungkus secara otomatis, tetapi seperti atribut di atas, ini adalah atribut yang mengontrol gaya. Dalam HTML 4.01, bgcolor, tinggi, lebar, dan sekarang tag <td> tidak disukai. Dalam XHTML 1.0 DTD yang ketat, bgcolor, tinggi, lebar, dan sekarang tag <td> tidak didukung.