如何将两行列表项与未对齐的第二行对齐？

Li 项目分两行。第二行没有边距

当处理跨越两行的列表项时，导致第二行与第一行不对齐，因此有必要实现对齐。出现这种情况的主要原因是列表中的内联元素允许后续文本流动而不影响其对齐方式。

要解决此问题，可以利用“text-indent”属性。此属性控制元素内文本第一行开始之前的间距。通过应用负的“文本缩进”值，第一行可以向左移动特定的量。然后可以使用正的“padding-left”值来偏移此位移，从而实现所需的对齐方式。

考虑以下示例：

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

在此示例中，“1.28571429em”值对应于负责复选标记的“font-awesome”图标元素的宽度。采用此技术可以使文本在两行的图标下方对齐，从而纠正未对齐的情况。

以上是如何将两行列表项与未对齐的第二行对齐？的详细内容。更多信息请关注PHP中文网其他相关文章！