没有缩进的 Ul 或 ol - CSS

什么是 Ul 或 ol？

在 HTML 中，<ul> 和 <ol> 元素用于创建无序和有序列表。无序列表无须顺序标注列表项，而有序列表需要顺序标注列表项。

通常情况下，浏览器会给所有的 ul 和 ol 列表添加默认的缩进样式。但是，有时我们需要将列表项按照自己的要求进行排版，这时就需要使用 CSS 样式来控制。

如何去除缩进样式？

下面是去除 ul 和 ol 缩进样式的一些 CSS 样式技巧：

1. 使用 margin 来清除默认缩进

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

解释

该代码段使用了 margin 来清除默认的缩进，并使用 padding 去除默认的列表标识。list-style:none; 表示去除列表标识符。

2. 让 ul 和 ol 的 padding 清零

ul, ol {
  padding-left: 0;
}

解释

该代码片段使用 padding-left:0; 技巧清除列表项的默认缩进。

3. 让每个列表项增加 margin-top 或 margin-bottom

ul li, ol li {
  margin-top: 10px;
}

解释

该代码片段在每个 li 元素上增加了 margin-top 属性，从而可以让每个列表项之间有一个固定的间距。

总结

使用上面这些 CSS 技巧，可以很容易地去除 ul 和 ol 的默认缩进样式，并按照自己的需要进行排版。