1有一個有序列表如何1個添加背景顏色列表中的項目
<ol>
<li class="odd">Lorem ipsum dolor sit amet, consectetur ...</li>
<li class="even">Some more text</li>
</ol>
看起來是這樣的：
1想要列表具有列表位置：外部，數量過剩（因爲他們做此頁面上），但有每個列表項的背景（其候補）覆蓋數爲好。
由於「外部」顧名思義，號被放在元素之外，所以你不能與李的背景顏色會影響他們。對於此解決辦法可能是使用LI內的額外的div：
<ol>
<li><div>Lorem ipsum dolor sit amet, consectetur ...</div></li>
<li><div>Some more text ...</div></li>
</ol>
然後添加以下CSS的DIV：
ol li div {
width: 100%;
height: 100%;
background-color: #FFAAAA;
margin-left: -20px;
padding-left: 20px;
}
這將移動格數下出現（這是-20px值），並在其文本回到正確的位置（即20像素值）。
這似乎運作良好。 – Gazzer 2010-07-27 11:05:06
在我的情況，「寬度：100％;高度：100％;從正常工作'防止這一點。 – 2017-10-25 19:42:56
而不是使用外，你可以用列表的位置：內，設置背景，然後用陰性切緣左推一下嗎？
列表樣式位置：外產生的過剩。注意文本（不是數字）如何在左邊垂直對齊方式。隨着「內部」數字本身下的文本流。 – Gazzer 2010-07-27 10:42:00
一種選擇是嘗試text-indent，例如
li {
list-style-position: inside;
text-indent: -1em;
padding: 10px 2em;
background-color: lime;
}
li.odd {
background-color: aqua;
}
1've使用負文本縮進的文本的第一行拉出，然後離開填充拉一切回到對準。您可能需要使用文本縮進和填充值打了一下。 1've只用單位數此列表項的測試。
1試過這種方法，但不幸的是它意味着第一個字（LOREM ......）不與第二行文字正確對齊。即這是不是一個真正的過剩。像1 – Gazzer 2010-07-27 11:06:31
說，你可能需要惹文本縮進值有點:)它在這裏工作，但是它依賴於其他事情，包括字體大小的負荷。 – 2010-07-27 11:29:16
display: block;
這裏有一個codepen演示瞭如何樣式列表項 http://codepen.io/anon/pen/qdwGXa
你是什麼意思「因爲他們此頁面上做」？ – Gavrisimo 2010-07-27 10:32:44
StackOverflow上本身的數量過剩。在長文本不走一（1）項下，但LOREM下進入。 – Gazzer 2010-07-27 10:35:51