Bagaimana untuk Mencapai Lebar Auto Sama untuk DIV Bersebelahan dalam CSS?

Mencapai Lebar Auto yang Sama untuk DIV Bersebelahan dalam CSS

Anda mempunyai DIV induk HTML yang mengandungi berbilang DIV anak dan anda mahu DIV kanak-kanak mengambil lebar yang sama secara automatik. Di bawah ialah penyelesaian yang mencapai ini menggunakan paparan: sifat jadual:

#wrapper {
    display: table;
    table-layout: fixed;
    width: 90%;
    height: 100px;
    background-color: Gray;
}

#wrapper div {
    display: table-cell;
    height: 100px;
}

Paparan: sifat jadual untuk DIV induk menyediakan struktur seperti jadual. Susun atur jadual: sifat tetap memastikan bahawa lajur (iaitu, DIV kanak-kanak) mempunyai lebar tetap. Paparan: sifat sel jadual untuk DIV kanak-kanak meletakkannya dalam "sel" jadual.

Penyelesaian ini berfungsi dengan berkesan dalam penyemak imbas moden kecuali untuk IE7. Berikut ialah beberapa contoh:

• Tiga DIV: https://jsfiddle.net/g4dGz/
• Dua DIV: https://jsfiddle.net/g4dGz/1/

Atas ialah kandungan terperinci Bagaimana untuk Mencapai Lebar Auto Sama untuk DIV Bersebelahan dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!