html - 包含号码的OL strip 化

Question

我的 html 中有一个 ol 列表，上面有行条纹。看起来行条纹是从数字后面开始的。有没有办法让行条纹从数字开始？

我已经包含了正在发生的事情的片段

h4:nth-child(even) {
    background-color: red;
}

<div class='panel-body'>
  <ol>
    <h4 class="people" style="font-family: sans-serif; display: block;">
    <li>
      <span class="name">One, O</span>
      <span class="status" style="color: rgb(79, 133, 27);">Arrived</span>
      <span class="time"  style="width: 97px; max-width: 97px;">In Service</span>
    </li>
  </h4>

  <h4 class="people" style="font-family: sans-serif; display: block;">
  <li>
    <span class="name">Two, T</span>
    <span class="status" style="color: rgb(79, 133, 27);">Arrived</span>
    <span class="time"  style="width: 97px; max-width: 97px;">Next</span>
  </li>
  </h4>
  <h4 class="people" style="font-family: sans-serif; display: block;">
    <li>
      <span class="name">thr, t</span>
      <span class="status" style="color: rgb(79, 133, 27);">Arrived</span>
      <span class="time"  style="width: 97px; max-width: 97px;">1 hr 20 min</span>
    </li>
  </h4>
</ol>
</div>

Answer 1

当然，添加 list-style-position: inside规则:

h4:nth-child(even) {
    background-color: red;
}
li {
    list-style-position: inside;  
}

<div class='panel-body'>
  <ol>
    <h4 class="people" style="font-family: sans-serif; display: block;">
    <li>
      <span class="name">One, O</span>
      <span class="status" style="color: rgb(79, 133, 27);">Arrived</span>
      <span class="time"  style="width: 97px; max-width: 97px;">In Service</span>
    </li>
  </h4>

  <h4 class="people" style="font-family: sans-serif; display: block;">
  <li>
    <span class="name">Two, T</span>
    <span class="status" style="color: rgb(79, 133, 27);">Arrived</span>
    <span class="time"  style="width: 97px; max-width: 97px;">Next</span>
  </li>
  </h4>
  <h4 class="people" style="font-family: sans-serif; display: block;">
    <li>
      <span class="name">thr, t</span>
      <span class="status" style="color: rgb(79, 133, 27);">Arrived</span>
      <span class="time"  style="width: 97px; max-width: 97px;">1 hr 20 min</span>
    </li>
  </h4>
</ol>
</div>