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

Bagaimana untuk Membuat Div Lebar Sama dengan CSS?

Barbara Streisand
Lepaskan: 2024-11-17 19:36:02
asal
959 orang telah melayarinya

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;
    }
    Salin selepas log masuk
  • HT ML:

    <div>
    Salin selepas log masuk

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!

sumber:php.cn
Kenyataan Laman Web ini
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
Artikel terbaru oleh pengarang
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan