自定义html符号点没有显示，只有普通的符号点没有显示我输入的自定义图像。

Question

我已经设置了自定义CSS，以确保我的ul和li上显示了一个定制的项目点IMG。IMG没有显示，只有默认的要点显示，而我所做的任何更改都没有帮助。它要么导致一切扭曲，要么什么也不发生。

如果你能的话，请告诉我。

以下是代码：

​

ul {
  list-style-position: inside;
  padding-left: 2rem;
  list-style-type:  !important;

} */



ul li {

  padding-left: 2rem;
  list-style-image: url(<img src="https://i.ibb.co/Tk59zVR/bullet-2.png" alt="bullet-2" border="0">);
  background-position: 0 0;
  background-size: 0

  
}

 <p class="section-subtitle">
          <ul>
            <li>Savings on running costs/in-house labour costs</li>
            <li>Allows you to stay focused on your core-business without distractions. </li>

            <li>Reduce risk – government regulations non-compliance fines</li>

            <li>Level the playing field – get access to the similar technology and expertise that big companies enjoy
            </li>
          </ul>
          </p>

​

Answer 1

必须为list-style-image定义ul，并且没有正确地使用img源。

​

ul {
  list-style-position: inside;
  padding-left: 2rem;
  /*you probably do not need this*/
  /*list-style-type: !important;*/
  list-style-image: url("https://i.ibb.co/Tk59zVR/bullet-2.png");
}

ul li {
  padding-left: 2rem;
  /*you probably do not need this*/
  /*background-position: 0 0; */
  /*background-size: 0*/
}

<p class="section-subtitle">
  <ul>
    <li>Savings on running costs/in-house labour costs</li>
    <li>Allows you to stay focused on your core-business without distractions. </li>

    <li>Reduce risk – government regulations non-compliance fines</li>

    <li>Level the playing field – get access to the similar technology and expertise that big companies enjoy
    </li>
  </ul>
</p>

​

Answer 2

列表样式的图像应该只包含图像的路径。您正在列表样式的图像中编写HTML，浏览器不知道。

您应该使用这样的列表样式图像：

ul {
  list-style-position: inside;
  padding-left: 2rem;
  list-style-image: url("https://i.ibb.co/Tk59zVR/bullet-2.png") !important;
}