html - 用任何字符替换 HTML 列表的项目符号

Question

我们如何用任何 HTML 字符替换 HTML 列表的项目符号，例如这个“-”？

在网上我找到了用 ASCI 字符替换的解决方案，但它不适用于 IE。

Answer 1

您可以更改列表样式类型：https ://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type

例如，如果您想要列表中不存在的一个，-您可以使用：

ul {
    list-style-type: none;
}

li:before {
    content: "- ";
}

示例：http: //jsfiddle.net/ExSjv/

编辑

如果您想在休息时正确对齐它们，请使用：

ul {
    list-style-type: none;
}

li:before {
    content: "- ";
    margin: 0 0 0 -10px;
}

请记住，偏移量取决于很多。所以它可能是另一个值-10px

示例：http: //jsfiddle.net/ExSjv/1/

最后的

对你来说，最好的是：

li:before {
    content: "- ";
    margin: 0 0 0 -15px;
    display: inline-block;
    width: 10px;
}

Answer 2

您可以使用 :before 选择器并更改 li 元素之前显示的内容

ul {list-style:none; margin: 0; padding: 0}
li { padding-left: 5px; }
li:before { content: '-'; margin-right: 5px; }

我还没有对此进行测试，可能需要进行一些调整，但你明白了