Produksi halaman web: ringkasan 10 kesalahan umum DIV+CSS
Penulis:Eve Cole
Waktu Pembaruan:2009-06-12 17:53:00
1. Periksa apakah ada kesalahan ejaan pada elemen HTML dan apakah tag penutupnya terlupakan.
Bahkan pengguna berpengalaman pun sering salah dalam menyusun div. Anda dapat menggunakan fungsi verifikasi Dreamweaver untuk memeriksa kesalahan.
2. Periksa apakah CSS sudah benar
Periksa kesalahan ejaan, lupa } di akhir, dll. Anda dapat menggunakan CleanCSS untuk memeriksa kesalahan ejaan CSS. CleanCSS adalah alat untuk mengurangi bobot CSS, tetapi juga dapat memeriksa kesalahan ejaan.
3. Tentukan dimana kesalahan terjadi
Jika kesalahan mempengaruhi tata letak keseluruhan, Anda dapat menghapus blok div satu per satu hingga tampilan kembali normal setelah menghapus blok div tertentu, dan Anda dapat menentukan di mana kesalahan terjadi.
4. Gunakan atribut border untuk menentukan karakteristik tata letak elemen kesalahan
Menggunakan tata letak atribut float dapat menyebabkan kesalahan jika Anda tidak berhati-hati. Saat ini, tambahkan atribut border ke elemen untuk menentukan batas elemen, dan penyebab kesalahan akan terungkap.
5. Elemen induk dari elemen float tidak dapat menentukan atribut clear.
Di MacIE, jika Anda menggunakan atribut clear pada elemen induk elemen float, tata letak elemen float di sekitarnya akan menjadi kacau. Ini adalah bug MacIE yang terkenal. Jika Anda tidak mengetahuinya, Anda akan mengambil jalan memutar.
6. Elemen float harus menentukan atribut lebar
Banyak browser mengalami bug saat menampilkan elemen float dengan lebar yang tidak ditentukan. Jadi, apa pun konten elemen float, atribut lebar harus ditentukan untuknya.
Selain itu, coba gunakan em alih-alih px sebagai unit saat menentukan elemen.
7. Elemen float tidak dapat menentukan atribut seperti margin dan padding.
IE memiliki bug saat menampilkan elemen float dengan margin dan padding yang ditentukan. Oleh karena itu, jangan tentukan atribut margin dan padding pada elemen float (Anda dapat menyarangkan div di dalam elemen float untuk mengatur margin dan padding). Anda juga dapat menggunakan peretasan untuk menentukan nilai luar biasa untuk IE.
8. Jumlah lebar elemen pelampung harus kurang dari 100%
Jika jumlah lebar elemen float tepat 100%, beberapa browser kuno tidak akan menampilkannya dengan benar. Oleh karena itu, pastikan jumlah lebarnya kurang dari 99%.
9. Sudahkah Anda mengatur ulang gaya default?
Beberapa atribut, seperti margin, padding, dll., akan diinterpretasikan secara berbeda oleh browser yang berbeda. Oleh karena itu, yang terbaik adalah mengatur semua margin dan padding ke 0, gaya daftar ke tidak ada, dll. sebelum pengembangan.
10. Apakah Anda lupa menulis DTD?
Jika hasil tampilan browser yang berbeda masih berbeda tidak peduli bagaimana Anda menyesuaikannya, Anda dapat memeriksa apakah Anda lupa menulis baris DTD berikut di awal halaman:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" " http://www.w3.org/TR/html4/loose.dtd ">