如何选择第一组<li>添加一个伪类，而不是嵌套的</li> <li>

Question

我添加了一个自定义图片来替换项目符号列表li。我使用:: before将其添加为伪类。但是，我无法仅定位第一组“ li”。伪类不可能吗？我已经尝试定位到第一组li :: before，但没有成功：

.hand-bullet-list> ul> li :: before {

.hand-bullet-list ul{
    list-style-type: none;
    margin-left: 0px;
}

.hand-bullet-list ul li{
    list-style: none;
    position: relative;
    padding: 0 0 22px 40px;
    margin-bottom: 20px;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}

.hand-bullet-list ul li::before{
    background: url(https://jeremybullocksafeschools.com/wp-content/uploads/3.png) no-repeat;
    content: "";
    width: 40px;
    height: 42px;
    position: absolute;
    left: 0px;
    top: 0px;
}

<div class="hand-bullet-list bullet-list-two-columns">
<p><strong>Committee<br />
</strong>Some text.</p>
<p style="font-weight: 400;"><strong>Members of Committee include</strong></p>
<ul style="font-weight: 400;">
<li>Member 1</li>
<li>Member 2</li>
<li>Group 1
<ul>
<li>Group 1a</li>
<li>Group 1b</li>
<li>Group 1c</li>
<li>Group 1d</li>
</ul>
</li>
<li>Member 3</li>
<li>Member 4</li>
<li>Member 5</li>
</ul>
</div>

Answer 1

此<div class="table-responsive border border-top-0"> <table class="table table-striped mb-0 fixed-header"> <thead> <tr> <th></th> <th></th> <th></th> <th></th> </tr> </thead> <tbody> <tr> <td></td> <td></td> <td></td> <td></td> </tr> ... </tbody> </table> </div> 完美运行。我建议你的问题在其他地方。

.hand-bullet-list > ul > li:before

.hand-bullet-list ul {
  list-style-type: none;
  margin-left: 0px;
}

.hand-bullet-list ul li {
  list-style: none;
  position: relative;
  padding: 0 0 22px 40px;
  margin-bottom: 20px;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid;
}

.hand-bullet-list>ul>li::before {
  background: url(https://jeremybullocksafeschools.com/wp-content/uploads/3.png) no-repeat;
  content: "";
  width: 40px;
  height: 42px;
  position: absolute;
  left: 0px;
  top: 0px;
}