如何將兩行列表項目與未對齊的第二行對齊？

Li 項目分兩行。第二行沒有邊距

當處理跨越兩行的列表項目時，導致第二行與第一行不對齊，因此有必要實現對齊。出現這種情況的主要原因是清單中的內聯元素允許後續文字流動而不影響其對齊方式。

要解決此問題，可以利用「text-indent」屬性。此屬性控制元素內文字第一行開始之前的間距。透過應用負的「文字縮排」值，第一行可以向左移動特定的量。然後可以使用正的“padding-left”值來偏移此位移，從而實現所需的對齊方式。

考慮以下範例：

ul {
  width: 300px;
}
li {
  padding-left: 1.28571429em;
  text-indent: -1.28571429em;
}

在此範例中，「1.28571429em」值對應於負責複選標記的「font-awesome」圖示元素的寬度。採用此技術可以使文字在兩行的圖示下方對齊，從而修正未對齊的情況。

以上是如何將兩行列表項目與未對齊的第二行對齊？的詳細內容。更多資訊請關注PHP中文網其他相關文章！