2

我知道这看起来很愚蠢，但我正在尝试将列表样式添加到 p 标签。由于 php 的循环方式，我无法将它们放在 li 标签中。所以我有点坚持尝试将它们设置为看起来像一个列表。

我尝试过这样的事情

.taskSubList{
  text-indent:2em;
  list-style-type:disc;
  display:list-item; 
}

但我似乎无法让它工作。有任何想法吗？

一个jsFiddle

4

2 回答 2

6

这个“不起作用”的原因是因为默认值在应用计数器list-style-position的元素之外；list-style-type这意味着，根据定义，它位于元素的左边距之外。因此，如果您指定一个margin-left（足够大的数字）它可以完美地工作：

p {
    text-indent:2em;
    list-style-type:disc;
    display:list-item;
    margin-left: 2em;
}

JS 小提琴演示。

或者，如果您指定list-style-position: inside它也可以：

p {
    text-indent:2em;
    list-style-type:disc;
    display:list-item;
    list-style-position: inside;
}

JS 小提琴演示。

于 2013-11-11T20:34:16.457 回答
0

您将能够通过使用其他答案和评论中提到的list-styleon标签来实现这一点。p但是您在这里还有另外两个选择：

  1. 使用 JavaScript 用元素包装 p 标签，或者在加载时使用 JavaScript (jQuery)li更优雅地替换p标签。ulli
  2. 用于background-image设置光盘映像并赋予padding-left标签p。

由于p标签不是列表，因此将解决方案与list-style-type和一起使用在语义上是不正确的display: list-item。我的解决方案 2 在语义上也不正确，因为您仍然使用p列表。如果您有可能使用解决方案 1，它会更好，或者只是修改 PHP 循环。

于 2013-11-11T20:31:27.153 回答