Bagaimana untuk Mengapungkan Tiga Div Bersebelahan Menggunakan CSS?

Terapung Tiga Div Bersebelahan dengan CSS

Mencipta susun atur mendatar bagi div boleh dicapai dengan mengapungkannya sebelah menyebelah. Walaupun mudah untuk melakukan ini dengan dua div, persoalan timbul: bagaimana anda mencapai kesan yang sama dengan tiga atau lebih div?

Penyelesaian terletak pada mentakrifkan lebar untuk setiap div dan menggunakan apungan sifat CSS: kiri;. Sifat ini meletakkan div secara mendatar dan memaksanya mengalir bersebelahan antara satu sama lain.

Untuk menggambarkan, pertimbangkan contoh berikut:

<div>

Dalam kod ini, kami mencipta div induk dengan lebar tetap 500px. Di dalamnya, kami mempunyai tiga div kanak-kanak, setiap satu dengan lebar yang ditentukan sendiri. Terapung: kiri; harta memastikan bahawa div kanak-kanak ini dijajarkan secara mendatar.

Akhir sekali,
elemen dengan sifat CSS clear: left; ditambahkan pada penghujung div induk. Ini mengosongkan sebarang elemen terapung, memastikan bahawa kandungan yang tinggal di bawah tiga div muncul sejajar dengan tepi kiri div induk.

Atas ialah kandungan terperinci Bagaimana untuk Mengapungkan Tiga Div Bersebelahan Menggunakan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!