Question

根据HTML Specs和this question的答案，ol中无法包含p。但为什么不呢？

我在APA style写了一篇论文，其中我想以段落形式使用有序列表。（有关列表有序和无序的APA格式的实现，请参阅OWL和editing-writing。）

有时，以段落形式显示列表是有意义的，为什么该列表在语义上不能成为段落的一部分？例如，在我的论文中，我有：

......一个问题集，涉及（a）在科学计数法和标准十进制表格之间转换0到1之间的数字，（b）计算大于0的数字的位置值，（c）比较正数和负数以及小于0的数字1，和（d）用科学记数法加上和减去数字。见附件......

如果你不相信这个列表在语义上是段落的一部分，请说明你为什么这么认为，因为我对你的意见感兴趣。

我真的很想知道如何使用HTML标记<ol>和<li>来编写此列表，但是将它们显示就好像它们是段。原因是从语义上讲，这些项目是有序列表的一部分，并将它们包含在正确的元素中对SEO有利，但我很好奇如何保持列表以段落形式写出。

Answer 1

现在，如果列表语义对您来说很重要，请将列表分成块，或者将其保留为文本字符串，就像您的示例一样，并继续您的生活。

如果你不相信这个列表在语义上是该段落的一部分，请说明你为什么这么认为，

是的。但那不是问题。

[...] ol不能包含在p中。但为什么不呢？

因为规范是这样说的。那是关于讨论的结束由于疏忽，HTML中不存在大量语义结构，这就是其中之一。例如，还没有标记脚注的真实方法，考虑到HTML最初是为了分享学术研究之类的东西而创建的，这很奇怪。（有一些documented cheats;不一样。）
鉴于你的链接，我假设你已经阅读了关于块元素和诸如此类的技术原因，所以我将跳过这里。

我真的很想知道如何使用HTML标记<ol>和<li>
来编写此列表

好吧，你可以从creating a custom DTD开始（即使你在绝大多数情况下都是really shouldn't）允许嵌套元素，然后弄清楚如何实际让列表流入段落（例如显示：内联等）以一种不会让浏览器呕吐的方式。或者可以为内联列表指定一个全新的元素。或者你可以继续进行更重要的事情。

这些项目是有序列表的一部分，并将它们包含在正确的元素中有利于SEO

有时，当人们将SEO作为做事的理由时，答案应该是“你太努力了，可能还有更好的事情要做。”这是其中之一。像“搜索引擎优化”这样的任何单一事物很少会使得任何接近与你无法做到的进攻有关的差异使它成为你的想法。您问题的真正答案涉及更改HTML规范。如果这是你喜欢做的那种工作，那么加入relevant WHATWG mailing list，提出你的建议，大概数月来保护它，如果你运气好，那么它将成为正式的。

Answer 2

ol和ul当前不能包含在p中的原因是因为段落元素只能包含内联元素，而列表是块级元素。< / p>

也许列表不应该被自动视为块级元素，但目前情况并非如此。

所以你的选择就是将摘录分成2段，并在它们之间加上一个列表，例如。

......涉及的问题集：


以科学计数法和标准小数形式在0和1之间转换数字，

计算大于0的数字的位置值，

将正数和负数与幅度小于1进行比较，

以科学记数法添加和减去数字。

见附件......

或者只是创建一个inline list，它可能无法验证，但在语义上是正确的，并且在大多数浏览器中都可以正常呈现。

Answer 3

我认为Su's excellent answer确定了重要的东西。我不确定CSS是否是您的特定项目的选项，但到目前为止可视包括段落中的列表，您可以使用CSS和一些<span>标签（和它）将验证）。

演示：http://jsfiddle.net/wg9zD/

<p>
    … a problem set involving
    <span class="list">
        <span class="list-item">converting between numbers between 0 and 1 in scientific notation and standard decimal form</span>
        <span class="list-item">counting place values of numbers greater than 0</span>
        <span class="list-item">comparing positive and negative numbers with magnitude less than 1, and</span>
        <span class="list-item">adding and subtracting numbers in scientific notation</span>
    </span>
    See the attached …
</p>

.list {
    counter-reset:mycounter 0;
}
.list-item {
    display: list-item;  
    list-style: inside none;
    margin: 1em;
}
.list-item:before {
    content: "(" counter(mycounter, lower-alpha) ") ";
    counter-increment: mycounter;
}

Answer 4

我想我已经想出了最好的方法。根据@Lèsemajesté的回答，我使用了一个内联列表：

<div class="paragraph">
  <p>... a problem set involving:</p>
  <ol>
    <li>converting between numbers between 0 and 1 in scientific notation and standard decimal form;</li>
    <li>counting place values of numbers greater than 0;</li>
    <li>comparing positive and negative numbers with magnitude less than 1; and</li>
    <li>adding and subtracting numbers in scientific notation.</li>
  </ol>
  <p>See the attached ...</p>
</div>

使用样式规则：

div.paragraph p {
  display: inline;
}
div.paragraph ul,
div.paragraph ol,
div.paragraph li {
  padding: 0px;
  display: inline;
  list-style-type: lower-alpha;
  font-weight: bold; /* for demo purposes */
}
div.paragraph {
  counter-reset: item; /* creates a counter called 'item' initialized to 0 */
}
div.paragraph li:before {
  counter-increment: item; /* Add 1 to 'item' counter */
  content: '(' counter(item, lower-alpha) ') '; /* display (item) */
}

这显示为：

......涉及的问题集：（a）以科学计数法和标准小数形式在0和1之间的数字之间转换; （b）计算大于0的数字的位置值; （c）比较正数和负数，幅度小于1; （d）用科学记数法加上和减去数字。见附件......

我如何在视觉上（或语义上）在<p>？</p> </ol>中包含<ol>

4 个答案: