WordPress網站上的有序和無序列表問題（ul不起作用）

Question

我搜索了這個論壇，但沒有找到任何解決方案。 如果list元素的內容輸入第二行，我的WordPress博客列表將無法正確縮進。 我發現了一個關於stackoverflow的修復程序， 如何通過CSS使有序列表中的第二行縮進？ ，我實現了如下所示：

.entry ol,.entry li {
margin: 0; padding: 0;
}
.entry ol {
counter-reset: foo;
display: table;
}
.entry li {
list-style: none;
counter-increment: foo;
display: table-row;
}
.entry li::before {
content: counter(foo) ".";
display: table-cell;
text-align: right;
padding-right: .5em;
padding-left: .5em;
}
.entry ul li {
list-style: inside disc;
list-style-image: none;
line-height: 19px;
}

在上述實現之后，我得到了適合我的列表的縮進，但是，每當我嘗試使用無序時，它都傾向於顯示為有序列表。 更糟糕的是，當我嘗試使用無序列表作為有序列表中的子列表時，（事情變得很瘋狂），它顯示為有序列表的延續，而不是無序列表。 請參閱我當前正在處理的博客中的示例：

http://www.medhealthng.com/abdominal-pain/

編輯我編輯我的代碼看起來像這樣：

.entry ol, .entry li {
    margin: 0;
    padding: 0;
}

.entry ol {
counter-reset: foo;
display: table;
margin-left: 1.3em;
margin-right: 1.3em;
line-height: 19px;
}
.entry li {
    list-style: none;
    counter-increment: foo;
    display: table-row;
}
.entry li::before {
    content: counter(foo)".";
    display: table-cell;
    text-align: right;
    padding-right: .3em;
    padding-left: .3em;
}

但是子列表仍然不能與無序列表一起使用

Answer 1

您在li標記內的::before標記具有counter(foo) "." 內容。

只需使用其他內容即可：

.entry > li::before {
  content: counter(foo) ".";
  display: table-cell;
  text-align: right;
  padding-right: .5em;
  padding-left: .5em;
}

如果希望子列表為無序列表，則進行編輯 ，為li內的ul標記提供一個類（即unordered ），並添加以下CSS：

.unordered > li::before {
  content: ".";
  display: table-cell;
  text-align: right;
  padding-right: .5em;
  padding-left: .5em;
}