首頁 > web前端 > css教學 > 如何控制 CSS 中項目符號和列表項之間的間距?

如何控制 CSS 中項目符號和列表項之間的間距?

Linda Hamilton
發布: 2024-12-11 15:39:16
原創
346 人瀏覽過

How Can I Control the Spacing Between Bullets and List Items in CSS?

CSS:調節項目符號與清單項目之間的距離

問題:

調整項目符號與其列表項之間的水平間距對應的

  • 有序或無序列表中的元素構成了挑戰。為了說明這一點,請考慮以下內容:
    * Some list text goes
       here.
    登入後複製

    期望結果:

    將空間修改為取得:

    *         Some list text goes
              here.
    登入後複製

    *Some list text goes
     here.
    登入後複製

    解決方案:

    將列表項目的內容包含在具有相對定位的span元素內。可以操縱 span 的 left 屬性來控制所需的間距。

    li span {
      position: relative;
      left: -10px;
    }
    登入後複製
    <ul>
      <li><span>item 1</span></li>
      <li><span>item 2</span></li>
      <li><span>item 3</span></li>
    </ul>
    登入後複製
  • 以上是如何控制 CSS 中項目符號和列表項之間的間距?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

    來源:php.cn
    本網站聲明
    本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
    作者最新文章
    熱門教學
    更多>
    最新下載
    更多>
    網站特效
    網站源碼
    網站素材
    前端模板