如何使用 CSS 消除包装无序列表中不需要的缩进？

使用 CSS 删除无序列表缩进

当无序列表中的文本环绕时，可能会出现不需要的缩进。要解决此问题，请尝试以下步骤：

1.删除缩进

删除默认填充和列表样式缩进：

ul {
    padding: 0;
    list-style-type: none;  
}

2.减小行高

如有必要，可将行高设置为等于字体大小或稍小：

ul li {
    line-height: 1em;
}

3.禁用浮动

删除应用于列表项的任何浮动属性，确保它们显示内联块：

ul li {
    float: none;
    display: inline-block;
}

4.调整字体大小

最后一步，将字体大小调整为您想要的外观。

示例

考虑以下代码：

<div>
<pre class="brush:php;toolbar:false">#info {
    ...
}

#info ul {
    padding: 0;
    list-style-type: none;
}

#info ul li {
    float: none;
    display: inline-block;
    line-height: 1em;
}

这种技术组合应该消除将线条包裹在无序列表中，确保外观干净且专业。