Rumah >hujung hadapan web >tutorial css >Bagaimana untuk Membuat Div Lebar Sama dengan CSS?

Bagaimana untuk Membuat Div Lebar Sama dengan CSS?

Barbara Streisand
Barbara Streisandasal
2024-11-17 19:36:02961semak imbas

How to Create Equal Width Divs with CSS?

Div Lebar Sama dengan CSS

Dalam senario ini, div induk mengandungi berbilang div anak dan anda mahu ia mempunyai lebar yang sama secara automatik.

Penyelesaian:

Gunakan kuasa paparan: jadual dan susun atur jadual: sifat CSS tetap. Teknik ini berfungsi dalam pelayar moden tetapi tidak dalam IE7.

  • CSS:

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

    <div>

Contoh:

Semak keluarkan demonstrasi JSFiddle ini untuk kedua-dua senario tiga dan dua div:

  • [Dua div](https://jsfiddle.net/g4dGz/1/)
  • [Tiga div]( https://jsfiddle.net/g4dGz/)

Atas ialah kandungan terperinci Bagaimana untuk Membuat Div Lebar Sama dengan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

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