Bagaimana untuk Kedudukan Terbaik Tiga Div Bersebelahan Menggunakan CSS?

Cara Meletakkan Tiga Elemen Div Bersebelahan Menggunakan CSS

Keupayaan untuk mengapungkan elemen dalam CSS ialah alat yang berkuasa untuk mencipta susun atur yang fleksibel. Walau bagaimanapun, apabila ia datang untuk meletakkan tiga elemen bersebelahan, tugas itu mungkin kelihatan sedikit lebih mencabar.

Masalahnya:

Adalah diketahui umum bagaimana untuk mengapungkan dua elemen secara mendatar dengan menetapkan satu terapung ke kiri dan satu lagi terapung ke kanan. Walau bagaimanapun, memanjangkan teknik ini kepada tiga elemen boleh menimbulkan persoalan tentang pendekatan terbaik.

Soalannya:

Untuk susun atur yang terdiri daripada tiga elemen div, sekiranya CSS terapung adalah digunakan atau adakah menggunakan jadual adalah penyelesaian yang lebih sesuai?

Jawapan:

Tidak perlu menggunakan jadual apabila menjajarkan tiga div sebelah-menyebelah dengan CSS. Penyelesaiannya terletak pada memberikan setiap div lebar tertentu dan menggunakan apungan: kiri; harta kepada mereka semua. Berikut ialah contoh yang menunjukkan pendekatan ini:

<div>

Dalam contoh ini, div induk berfungsi sebagai bekas dengan lebar yang ditentukan. Tiga div anak kemudiannya masing-masing diberikan lebar tertentu dan terapung ke kiri, menyebabkan mereka berbaris secara mendatar dalam div induk. Yang jelas: kiri; gaya digunakan pada elemen
penutup untuk memastikan sebarang kandungan di bawah div terapung tidak terjejas oleh kedudukannya.

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