1

我有一个指向他们个人资料的学生链接列表，所以我想要笑脸而不是普通的圆形项目符号。图片为 14x14。我该怎么做才能使项目符号仅使用 CSS 显示？

ul {
  list-style-type:url(smiley.tiff);
  text-transform:capitalize;
}
4

4 回答 4

4

使用 CSS 背景。list-style-image不会为您提供定位选项，而且通常看起来很糟糕。为您的布局相应地调整像素值。

li.icon {
     background-image:url(...);
     background-repeat:no-repeat;
     background-position:3px 3px;
     min-height:16px;
     padding-left:20px;
}

顺便说一句 - 不要使用 TIFF（并非所有浏览器都支持 TIFF），该文件可能会很大。将其转换为PNG。

于 2013-07-30T20:54:58.823 回答
0

请改用list-style-image CSS 规则。而且，为了以防万一，请将网址括在引号中；大多数浏览器在没有它们的情况下都能正确解释它，但这是一种很好的做法。

list-style-image: url('smiley.tiff');
于 2013-07-30T20:55:47.273 回答
0

最简单的方法是设置：

ul { 
  list-style-image: url(‘images/sample-bullet.png’)
}

这样你就可以选择任何你想要的图像。有一篇很棒的关于子弹样式的文章，我认为您可以从这里受益。

于 2018-04-20T07:05:26.193 回答
-3

只是简单地使用字体真棒，使列表样式：无并使用字体真棒图标简单快乐编码：D

于 2014-08-11T13:30:37.893 回答