首頁 >web前端 >css教學 >為什麼我的清單項目在 CSS 重設後發生移動,如何修復對齊?

為什麼我的清單項目在 CSS 重設後發生移動,如何修復對齊?

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-11-25 21:53:12710瀏覽

Why Are My List Items Shifting After a CSS Reset, and How Can I Fix the Alignment?

CSS 重置後列表項目發生移動:將第二行與項目符號對齊

使用CSS 重置後,一些用戶遇到了以下問題:列表項目(li) 中的第二行文字在換行後從項目符號下方開始。這種視覺上的錯位可以透過調整 li 標籤的 list-style-position 屬性,將其設為「outside」來修正。

但是,此解決方案可能會導致項目符號出現縮排問題。為了解決這個問題,可以將額外的 margin 屬性應用於 ul 父元素,確保與清單外部的文字對齊。

更新的解決方案(2014 年3 月15 日):

ul {
  list-style-position: outside;
  margin-left: 1em;
}

這段程式碼提供了更完善的解決方案,解決了前面提到的縮排問題並提高了可讀性。 margin 屬性應用於 ul 元素,確保整個清單縮進,與清單外部的文字保持正確對齊。

以上是為什麼我的清單項目在 CSS 重設後發生移動,如何修復對齊?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn