Bagaimanakah Saya Boleh Mengawal Jarak Antara Titik Bullet dan Senarai Item dalam CSS?

Dalam reka bentuk web, selalunya wajar untuk menyesuaikan jarak antara titik tumpu dan

) atau senarai tidak tersusun (
). Artikel ini memberikan penjelasan menyeluruh tentang cara mencapai ini menggunakan CSS.

Cabarannya terletak pada keupayaan untuk melaraskan ruang mendatar antara peluru dan

• teks. Secara tradisinya, CSS menyediakan pilihan untuk mengalihkan keseluruhan blok teks ke kiri atau kanan, seperti yang diterangkan dalam sumber seperti yang dinyatakan dalam soalan.

  Walau bagaimanapun, penyelesaian yang lebih berkesan adalah dengan menyertakan teks item senarai dalam elemen rentang dan gunakan kedudukan relatif padanya. Ini membolehkan kawalan tepat ke atas ruang antara titik dan teks.

  Kod CSS:

  li span {
    position: relative;
    left: -10px;
  }

  Salin selepas log masuk

  Contoh HTML:

  <ul>
    <li><span>item 1</span></li>
    <li><span>item 2</span></li>
    <li><span>item 3</span></li>
  </ul>

  Salin selepas log masuk

  Dengan melaraskan sifat kiri span, anda boleh menetapkan jarak yang diingini dengan mudah antara titik dan senarai teks item. Pendekatan ini memberikan lebih fleksibiliti dan kawalan ke atas reka letak senarai anda.

  Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengawal Jarak Antara Titik Bullet dan Senarai Item dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!