为<li> </li>添加特殊背景图像

Question

我正在尝试在每个<li>

的一侧添加特殊的jpg图像

但是list-style-image:url('sqpurple.jpg');工作不好，如何使子弹的位置在电梯侧？

Answer 1

最好的方法是使用background-image而不是list-style

#ul_id { 
   list-style: none; padding 0px; margin: 0px;}

 #ul_id li {
   background-image: url("/Content/Icons/bullet.png"); // url path location
   background-position: 1px 2px; // the position of the background
   background-repeat: no-repeat; // make the background not to repeat
            }

Answer 2

使用 list-style-postion 尝试使用以下更改代码

ul li{
  list-style-position: outside;
  list-style-image: url(sqpurple.jpg);
  padding-left: 10px 
}

或使用背景图片

ul{
   list-style-type: none;
   padding: 0;
   margin: 0;
}
li{
   background: url(arrow.gif) no-repeat left top;
   padding-left: .6em;
}