在html中的段落中嵌套列表答案

【问题标题】：Nest lists in paragraphs in html在html中的段落中嵌套列表
【发布时间】：2010-07-07 01:38:31
【问题描述】：

似乎（严格的）html 不允许在 <p> 内嵌套任何非内联元素，但是我应该如何呈现包含列表的段落（在自然文本中经常出现的内容）。我看过三个似乎都不满意的答案：

列表不应出现在段落中。（我不打算进行文化辩论，但我当然希望 html 不会成为决定写作风格的地方。）
将文本分成一个段落，然后是一个列表，然后是第二个带有后文本的段落。这看起来很糟糕，因为现在我有 <p> 块，它们是段落的部分，这对于试图朝着更语义化的方向移动的标记来说似乎很糟糕。
使用一些 <div class="mypara"> 伪造段落 - 这看起来是绕过整个事情并放弃使用具有适当文本语义的标记的不好方法。

还有其他在语义上正确且有效的方法吗？

【问题讨论】：

+1 用于指出此问题的常见解决方法。这个问题更加明显，当你在句子中间使用一个列表来强调它的结构时，将一个句子分成不同的段落在语义上肯定是不正确的。例如。 “我今天想买 [list]• 牛奶、• 糖、• 苹果和• 中提琴[/list]。”这通常在使用 TeX 排版文本时使用。

标签： html markup xhtml-1.0-strict

【解决方案1】：

在最新的工作草案中，HTML 5 中的段落被定义为只能包含短语元素的流元素。列表也被定义为流程元素，并且不能包含在段落中。无论你认为段落的定义应该是什么，这是 HTML 中术语的正式定义，我认为它不太可能改变。

除了您提到的两种可能性之外，您还可以考虑两种可能性：

如果适用，请考虑使用比段落更广泛的流程元素，例如 section、nav、header、footer 或 article。
使用混合方法：使用您选择的 div 包装 p – ol – p 序列，将通用格式应用于集合。

就div 而言，HTML 5 规范明确建议它应该是“最后的手段”元素，因为它不像其他 HTML 元素那样具有语义意义，并且可能不像用户那样- 对替代用户代理友好。按照这个建议，如果语义对您很重要，我不会以p 为代价使用div 作为正文文本。但是，它有助于确保使用多个段落不会在视觉上过于混乱。

【讨论】：

我面临的情况是生成HTML的系统，因此在这种情况下最好的选择似乎是使用divs。除此之外，使用更宽标签的建议似乎也是一个好主意。

【解决方案2】：

我不认为 html <p> 标签是用来控制实际写作风格的习语。这是一种以有序方式显示一大块文本的简单方法。我不相信它是为了模拟印刷材料。您将不得不为此使用一个 Div。

【讨论】：

如果它只是为了格式化，那么使用p标签似乎没什么意义......但我很确定我已经看到一些提到的浏览器处理它们不同 - 但我不记得在哪里。（可能与屏幕阅读器有关。）
有些人可能会以不同的方式处理它，但您永远不想将您的工作质量押在这些实施上。你总是，总是，想争取中间立场；您能让更多的用户感到高兴，您的网站就会变得更好。
根据 HTML 4.01 规范，段落是一个内联元素。这就是他们不想嵌套的原因。

【解决方案3】：

这一切背后有视觉风格的原因吗？换句话说，当您有类似以下内容时，它是否以您认为不理想的方式在视觉上呈现？

<p>Some paragraph text.</p>
<ul>
    <li>First list item</li>
    <li>Second list item</li>
    <li>Third list item</li>
</ul>
<p>Another paragraph.</p>

如果问题是 P 之后和 UL 之前的余量太大，那么你可以尝试像这样的相邻兄弟选择器来弥补：

p + ul { margin-top: -1em; }

【讨论】：

视觉渲染不是问题（div 无论如何都可以正常工作）——它试图找到一些“正确”的方法来做到这一点，保持标签有意义。

【解决方案4】：

我想这取决于您认为什么是“段落”。对我来说很明显，HTML 的设计者绝不会将列表视为段落的一部分。虽然我认为这两种解释都可以提出论据，但我认为规范是正确的。

虽然列表并不代表思路的中断，但它肯定代表了声音或思维方法的变化，我认为这值得一个新的语义容器。

同样，一个段落代表一篇文章中的一个逻辑分区。一个列表表示一系列逻辑分区，虽然可以想象一个逻辑分区随后可以划分为更多分区，但简单地创建一个新分区更有意义（尤其是对于语音/方法中如此大的中断）。

语义在很大程度上可能是主观的。这很好。但是，在这种情况下，我认为 HTML 规范正确地表示了语义。

【讨论】：

嗯，我特别避免讨论这是否是一个正确的决定——更重要的是，我不认为 HTML 规范作者应该处于一个位置他们确定段落中的列表是否应该被允许。这需要对不同文化的印刷作品进行彻底的调查，当然有很多印刷系统的例子（La/TeX 是一个明显的例子）允许在段落中嵌套列表。
我想，你的问题的简单答案是“不”
顺便说一句——我个人认为，如果官方规范的答案是你不应该在段落内写一个列表，因为它是错误的，并且如果没有这样彻底的调查（Unicode 作者投资很多时间），那么这只是单纯的傲慢。这就是为什么我希望实际答案基于渲染和演示的技术问题，而不是为我决定什么应该被认为是好的风格。
@Zee：我猜在这一点上，legacy 是驱动因素，实际上，p 是否应该能够包含列表。 ul 和 ol 应该暗示断句的概念可以追溯到 HTML 1.2。

【解决方案5】：

您的问题的答案显然是否定的，因为规范说您不能这样做。和你一样，我喜欢保持语义，所以我通常选择你的第二个选项（段落、列表、另一个段落）。但是，在我的脑海中，我想不出列表实际上不会破坏文本流的任何文本，所以似乎在列表之后开始一个新段落不会有什么坏处。

【讨论】：

列表成为前面文本的一部分可能更常见（我知道它的呈现方式不会有任何区别，但我试图找出正确的东西是什么...)。