Bagaimanakah Saya Boleh Memaparkan Berbilang Elemen Div Sebaris pada Baris Tunggal?

Memaparkan Elemen Div Sebaris

Apabila membuat halaman web, anda mungkin menghadapi situasi di mana anda ingin memaparkan berbilang elemen div bersebelahan dengan setiap lain pada garis mendatar yang sama. Walau bagaimanapun, elemen div secara lalai ialah elemen blok, bermakna ia secara semula jadi dipaparkan pada baris berasingan.

Div Sebaris: Penyelesaian

Untuk mencapai paparan sebaris untuk elemen div, terdapat penyelesaian yang melibatkan mengatasi sifat peringkat blok lalai. Satu kaedah yang popular ialah dengan secara eksplisit menetapkan sifat paparan mereka kepada sebaris menggunakan CSS. Ini memaksa mereka untuk berkelakuan sebagai elemen sebaris, muncul bersebelahan antara satu sama lain pada satu baris.

Contoh:

Pertimbangkan HTML berikut:

<div>foo</div>
<div>bar</div>
<div>baz</div>

Secara lalai, div ini akan disusun secara menegak. Untuk memaparkannya sebaris, tambahkan CSS berikut:

div {
  display: inline;
}

Pengubahsuaian ini menghasilkan hasil yang diingini:

foo bar baz

Pendekatan Alternatif: Gunakan Elemen Span

Pendekatan lain ialah menggantikan elemen div dengan elemen span. Span sememangnya elemen sebaris, jadi penggunaannya dan bukannya div menghapuskan keperluan untuk menimpa CSS.

<span>foo</span>
<span>bar</span>
<span>baz</span>

Dalam kes ini, rentang akan dipaparkan secara automatik sebaris secara lalai.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Memaparkan Berbilang Elemen Div Sebaris pada Baris Tunggal?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!