css列表-样式-图像大小?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (67)

我正在尝试将带有CSS的自定义SVG图标设置为<ul>清单上的物品。例子:

<ul>
    <li style="list-style-image: url('first.svg')">This is my first item</li>
    <li style="list-style-image: url('second.svg')">And here's my second</li>
</ul>

问题是,这些图像太大,并延伸了线的高度。我不想改变图像大小,因为使用SVG的目的是与分辨率进行缩放。是否有一种方法可以使用css来设置图像的大小,而不需要使用background-image

提问于
用户回答回答于

可能希望尝试IMG标记,而不是设置“列表样式-图像”属性。使用CSS设置宽度和高度将实际裁剪图像。但是,如果使用IMG标记,图像将被调整为宽度和高度的值。

用户回答回答于

我会用:

li{
   list-style: none;
}
li:before{
   content: '';
   display: inline-block;
   height: y;
   width: x;
   background-image: url();
}

扫码关注云+社区

领取腾讯云代金券