列表样式图像的问题

Question

我的子弹列表存在问题，使用图像而不是常规项目分配的子弹。图像不会放在列表旁边，而是放在一组单词中。

此部分的HTML如下所示：

     li {
       background: url('http://s30.postimg.org/52wxo16t9/bullet_Image.png') 2px 4px no-repeat;
       display: list-item;
       padding: 3px 3px 3px 20px;
       overflow: visible;
       list-style: none;
     }

<ol>
  <li class="planet">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
  <li class="planet">Aliquam tincidunt mauris eu risus.</li>
</ol>

Answer 1

您可以在ol标记处使用li{ background:url('http://s30.postimg.org/52wxo16t9/bullet_Image.png') no-repeat; background-size: 10px 10px; display: list-item; background-position:0px 7px; padding: 3px 3px 3px 20px; overflow: visible; list-style: none; } 属性轻松完成此操作。

list-style-image

example

Answer 2

将其更改为：

...