是否可以为<li>标签项目符号使用自定义文本？

Question

我想为li标签使用字符而不是图片.我在Google上找不到任何帮助.
我知道,list-style-image: url(myimage.gif)但我不想使用图片,因为它不具有可扩展性,并且在视网膜上看起来不太好.

Answer 1

你的意思是"我可以使用一些文字而不是一个子弹点或图像"吗？

如果是这样,css :before伪元素可以帮助:

li {
  list-style-type: none;
}

li:before {
  content: '* ';
}

显然用你选择的文字替换"*".

您可以根据需要在:before元素上使用常规CSS 进行样式设置.例如:

li:before {
  content: '> ';
  font-family: 'wingdings';
  font-weight:  bold;
}

通过将此技术与Font Awesome等SVG字体相结合,您可以获得可伸缩的图形.