将背景图片添加到< ol>数字 [英] Add background image to <ol> numbers

问题描述

我无法找出一个优雅的方式来使用CSS完成以下操作：

I can't figure out an elegant way to accomplish the following using CSS:

我需要有序列表的数字以具有蓝色气泡的背景。我有这个图片（包括白色笔触）：

I need the numbers of the ordered list to have the teal bubble-looking background. I have this image (which includes the white stroke):

但我不知道如何把它放在每个数字后面使用CSS。谢谢。

But I can't figure out how to put it behind each of the numbers using CSS. Thanks.

推荐答案

我可能会这样做：

ol {
    list-style-position: inside;
    color: white;
}
ol li {

    background-image: url('nswCH.png');
    background-position: -5px;
    background-repeat: no-repeat;
    padding-left: 7px;
}

这篇关于将背景图片添加到< ol>数字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！