html - 创建一个具有背景颜色的列表项，包括悬停时的列表项编号

Question

我正在尝试创建一个在悬停时具有背景颜色的有序列表，问题是我无法获得在悬停时更改颜色的数字。

https://jsfiddle.net/5ap327u9/1/

我试过使用 list-item-position: inside 但这会将数字放在内容上方，而不是像普通列表那样放在旁边

<div class="container">
  <ol>
  <li class="item-container">Help me get the background color to pink even the list number please.</li>
  </ol>
</div>

.container {
  ol li:hover {
        background: pink;
  }
}

我想要整行包括带有文本的数字来改变背景颜色

Answer 1

你需要使用 list-style-position 而不是 list-item-position

ol {
list-style-position: inside;
}