Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Memusatkan Senarai Tidak Tertib Lebar Tidak Diketahui?

Bagaimana untuk Memusatkan Senarai Tidak Tertib Lebar Tidak Diketahui?

DDD
DDDasal
2024-11-04 02:37:29628semak imbas

How to Center an Unordered List of Unknown Width?

Memusatkan Senarai Tidak Tertib Lebar Tidak Diketahui

Dalam reka bentuk web, selalunya diingini untuk memusatkan senarai pautan secara mendatar, seperti yang terdapat dalam pengaki. Walaupun menjajarkan teks adalah mudah, memusatkan senarai tidak tertib tanpa menyatakan lebarnya boleh menjadi rumit.

Soalan:

Bagaimanakah anda mendatar melintang senarai tidak tertib lebar yang tidak diketahui, di manakah item senarai harus dipaparkan bersebelahan, bukan satu di bawah satu sama lain?

Jawapan:

Pilihan 1: Paparan Sebaris

Jika item senarai boleh ditetapkan untuk dipaparkan: sebaris, penyelesaiannya mudah:

<code class="css">#footer {
  text-align: center;
}

#footer ul {
  list-style: none;
}

#footer ul li {
  display: inline;
}</code>

Pilihan 2: Paparan Sekat dengan Kedudukan

Jika paparan: blok mesti digunakan untuk item senarai, pertimbangkan CSS berikut:

<code class="css">#footer {
  width: 100%;
  overflow: hidden;
}

#footer ul {
  list-style: none;
  position: relative;
  float: left;
  display: block;
  left: 50%;
}

#footer ul li {
  position: relative;
  float: left;
  display: block;
  right: 50%;
}</code>

Atas ialah kandungan terperinci Bagaimana untuk Memusatkan Senarai Tidak Tertib Lebar Tidak Diketahui?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
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