Rumah  >  Artikel  >  hujung hadapan web  >  Perbezaan dalam padding dan margin antara browsers_Experience exchange

Perbezaan dalam padding dan margin antara browsers_Experience exchange

WBOY
WBOYasal
2016-05-16 12:09:081846semak imbas

Margin dan padding mungkin sentiasa digunakan, tetapi bagaimana untuk menyelesaikan masalah yang timbul? Kerana penyemak imbas mentafsir lebar bekas dengan cara yang berbeza:
IE 6.0 Firefox Opera, dsb. ialah
lebar sebenar=lebar+padding+margin+sempadan
IE5.X
lebar sebenar=lebar-padding-margin-sempadan

Penyelesaiannya ialah:

div.content {
width:400px; //Ini adalah lebar yang salah, semua pelayar membacanya
voice-family: ""}""; //IE5.X/win mengabaikannya Kandungan selepas ""}""
voice-family:inherit;
width:300px; //Sesetengah pelayar termasuk IE6/win membaca ayat ini dan nilai baharu (300px) menimpanya Lama
}
html> ;body .content { //html>body ditulis dalam CSS2
width:300px; //Pelayar yang menyokong CSS2 (bukan IE5) cukup bertuah untuk membaca ayat ini
}

div.content {
width:300px !important; //Ini ialah lebar yang betul yang menyokong teg !important menggunakan nilai di sini
width (space)/**/:400px ; //IE6/win tidak menghuraikan ayat ini, jadi IE6/win masih berpendapat bahawa nilai lebar ialah 300px manakala IE5.X/win membaca ayat ini, nilai baharu (400px) menimpa yang lama kerana !penting; tag Ia tidak berfungsi untuk mereka
}
html>body .content { //html>body ditulis dalam CSS2
width:300px; //Pelayar yang menyokong CSS2 cukup bertuah untuk membaca ayat ini
}


Perbezaan dalam padding dan margin antara browsers_Experience exchangeKecil
Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn