應用 CSS 重設後如何修復未對齊的清單行？

修正CSS 重設清單中的行對齊

在樣式領域，CSS 重設是一個很有價值的工具，它提供了一致的效果網絡開發的基礎。然而，某些元素在應用重置後可能需要額外的調整。一個常見問題是清單中的行對齊 (

)。

問題：重置後行未對齊

使用CSS 重置後，如果列表項目(

• ) 中的文字足夠長，可以換行到第二行，則您可能會遇到文字在項目符號下方開始而不是在項目符號下方開始的問題而不是與項目符號右側的文字對齊。

  解決方案：設定清單樣式位置

  要解決此對齊問題，請調整清單li 元素的 -style-position 屬性。預設情況下，此屬性設定為內部，導致文字環繞項目符號。將其變更為外部會將項目符號移到清單之外，從而實現正確的文字對齊。

  ul li {
    list-style-position: outside;
  }

  注意事項

  雖然此修復會對齊列表內的文本，它可能會導致列表外的項目符號和文本之間出現錯位。要解決此問題，請考慮為ul 元素添加margin-left，如下所示：

  ul {
    margin-left: 1em;
  }

  透過實施這些調整，即使在應用後，您也可以確保清單行在網頁設計中正確對齊CSS 重設。

以上是應用 CSS 重設後如何修復未對齊的清單行？的詳細內容。更多資訊請關注PHP中文網其他相關文章！