Bagaimana untuk Memaparkan Item Senarai Tidak Teratur Secara Mendatar Menggunakan CSS?

Cara Membuat Paparan Senarai Tidak Tersusun Secara Mendatar Berturut-turut

Anda boleh menggunakan CSS untuk memformat elemen HTML dalam pelbagai cara. Satu tugas penggayaan biasa ialah menyusun item senarai secara mendatar dan bukannya menegak. Artikel ini menerangkan cara untuk mencapai kesan ini menggunakan sifat paparan.

Masalah

Bagaimanakah saya boleh membuat item senarai muncul secara mendatar dalam satu baris menggunakan CSS?

Penyelesaian

Item senarai lazimnya ialah elemen sekat, yang bermaksud ia dipaparkan pada barisnya sendiri. Untuk menjadikannya mengalir secara mendatar, anda perlu menukarnya kepada elemen sebaris. Ini dilakukan menggunakan sifat paparan:

#ul_top_hypers li {
  display: inline;
}

Dalam kod awal anda, anda telah menggunakan paparan: sifat sebaris pada elemen ul itu sendiri. Walau bagaimanapun, ini hanya mempengaruhi senarai keseluruhan, bukan item senarai individu. Untuk menjadikan item senarai dipaparkan secara mendatar, anda perlu menggunakan pemilih konteks untuk menggunakan paparan: sifat sebaris pada item tersebut secara khusus.

Contoh Berfungsi

Berikut ialah coretan dikemas kini yang menunjukkan cara untuk memaparkan senaraikan item secara mendatar dalam satu baris:

<div>

#div_top_hypers {
  background-color: #eeeeee;
  display: inline;
}

#ul_top_hypers li {
  display: inline;
}

Atas ialah kandungan terperinci Bagaimana untuk Memaparkan Item Senarai Tidak Teratur Secara Mendatar Menggunakan CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!