Rumah > hujung hadapan web > tutorial css > Bagaimanakah Saya Boleh Meletakkan Dua Div Bersebelahan Menggunakan CSS?

Bagaimanakah Saya Boleh Meletakkan Dua Div Bersebelahan Menggunakan CSS?

Susan Sarandon
Lepaskan: 2024-12-20 02:01:09
asal
887 orang telah melayarinya

How Can I Position Two Divs Side-by-Side Using CSS?

Meletakkan Dua Div Bersebelahan dalam CSS

Mencipta dua div bersebelahan boleh menjadi keperluan susun atur biasa. Untuk mencapai matlamat ini, pertimbangkan pendekatan berikut:


Flexbox:

Dalam penyelesaian ini, flexbox ialah digunakan untuk menyusun div secara mendatar:

<h1>ibu bapa {</h1><p>paparan: flex;<br>}</p><h1>sempit {</h1><p>lebar: 200px;<br> latar belakang: biru muda; /<em> Supaya ia kelihatan </em>/<br>}</p><h1>lebar {</h1><p>flex: 1; /<em> Tumbuh ke seluruh bekas </em>/<br> latar belakang: hijau muda; /<em> Supaya ia kelihatan </em>/<br>}<br>

<div> <div id="wide">Wide ( selebihnya lebar)</div><br> <div></div><br>

Pendekatan ini membolehkan anda menentukan lebar tetap untuk div kiri (#narrow) manakala div kanan (#wide) secara automatik menduduki ruang yang tinggal, memenuhi lebar skrin.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Meletakkan Dua Div Bersebelahan Menggunakan 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