Bagaimanakah Saya Boleh Mencipta Senarai Berbilang Lajur dengan CSS dan Mengendalikan Keserasian Internet Explorer?

Membuat Lajur daripada Senarai Menggunakan CSS

Halaman web anda menampilkan senarai panjang yang menatal secara berlebihan. Untuk meningkatkan kebolehbacaan, anda ingin memaparkan senarai ini dalam berbilang lajur tanpa memerlukan pelarasan manual yang meluas apabila senarai berkembang.

CSS memberikan penyelesaian yang mudah:

ul {
    column-count: 4;
    column-gap: 20px;
}

Kod CSS ini memastikan bahawa senarai akan dibahagikan kepada empat lajur, dengan jurang 20 piksel antara mereka.

Keserasian Merentas Pelayar

Penyelesaian CSS untuk mencipta lajur disokong secara meluas merentas penyemak imbas kecuali Internet Explorer 9 dan lebih lama.

Alternatif untuk Internet Explorer

Jika anda memerlukan keserasian Internet Explorer, anda boleh mempertimbangkan Alternatif JavaScript, seperti pemalam Columnizer jQuery.

Fallback to Float for Internet Explorer

Alternatif khusus untuk Internet Explorer ialah menggunakan sandaran terapung. Ini mungkin mengakibatkan susunan item yang salah, tetapi penampilan visual akan serupa:

li {
    width: 25%;
    float: left
}

Anda boleh menggunakan sandaran ini secara selektif menggunakan Modernizr jika sudah ada dalam projek anda.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mencipta Senarai Berbilang Lajur dengan CSS dan Mengendalikan Keserasian Internet Explorer?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!