段落中的列表或更長的代碼片段

Question

在編寫算法時，在段落內部編寫一些（僞）代碼或（即使在句子的中間）通常都很方便。爲了在視覺上支持更復雜句子的結構，列表也很方便。

顯然，一句話不能在不同的段落中分開。但在我們的情況下，它必須歸因於HTML嵌套規則。

段落爲the p element，其中不能包含塊級元素。不幸的是，對於我們的情況，pre和lists是block-level。

如果我不遵守規範，包括pre或在pol/ul/dl，該p是我知道的任何解析器元素的開始標記前右自動關閉。 （這是由於p上的SGML OMITTAG feature設置造成的。）也許這和向後兼容性是拒絕pre和p內部列表的設計決定背後的原因。

有什麼辦法，如何將列表和更長的代碼片段包含到段落中？

---

我能重新制訂我的句子和段落並不需要片段和列表，但它需要大量的思考和關注，並可以讓我的文字難以閱讀和理解。這是對我來說不是解決方案。

我可以用code與whitespace: pre和display: block更長的代碼段和code與whitespace: pre-wrap爲短的。這在語義上是正確的嗎？

我可以把句子裏面的列表看作僅僅是可視化糖而沒有任何語義。然後，我會使用span與display: list-item使它們看起來像列表。從語義的角度來看，這是否正確？語義結構的犧牲是必要的嗎？

---

這個問題同時適用於HTML和XHTML，因爲嵌套元素的規則是相同的。通過HTML我的意思是HTML 4.01嚴格，通過XHTML我的意思是XHTML 1.0嚴格。這個問題在HTML5中是以某種方式解決的？

要明確，我想要一個符合標準，既語法和語義正確的解決方案，而不是一個非標準黑客的任何一種。具體而言，將p轉換爲div對我來說不是解決方案。

---

相關問題

• ul element can never be a child of p element
• <code> vs <pre> vs <samp> for inline and block code snippets
• <pre> tag making browsers close paragraphs
• Can I have a <pre> Tag inside a <p> tag in Tumblr?
• Should ol/ul be inside <p> or outside?
• unordered list in a paragraph element
• Nest lists in paragraphs in html

參見

• CSS Design: Taming Lists @ A List Apart

Answer 1

至於HTML而言，所有單個<p>元素表示是的措辭內容的塊恰好流動等一段文字。儘管它被稱爲一個段落，但它不必嚴格代表一段書面文字。

爲了引入列表或塊級代碼片段，您不會以任何方式破壞語義，即將中間句子分段爲兩個<p>元素。這是完全可以接受的。

由於事實上，HTML5 agrees（而HTML 4可悲絕對沒有說超過了「P元素表示一個段落」）：

列表元素（特別是ol和ul元素）不能兒童p元素。因此，當一個句子包含一個項目符號列表時，可能會想知道它應該如何標記。

例如，這奇妙句子具有與

• 嚮導子彈，
• 快於光行進，並
• 心靈感應，

和進一步討論下面。

解決方案是要認識到，用HTML表示的paragraph不是一個邏輯概念，而是一個結構性概念。在上面這個神奇的例子中，實際上有五個paragraphs，這個規範定義了：在列表之前，在每個項目符號之前，在列表之後。

對於上面的例子中的標記可以因此是：

<p>For instance, this fantastic sentence has bullets relating to</p> 
<ul> 
<li>wizards, 
<li>faster-than-light travel, and 
<li>telepathy, 
</ul> 
<p>and is further discussed below.</p> 

如果查看文檔的源，則可以看到，即使在引用的例子包括含有一個<p>元件的文本「上述示例的標記因此可以是：」，緊接着包含示例標記的<pre>元素。

如果您仍然擔心，HTML5提供了一個替代方案，但基本上涉及到使用<div>而不是單獨的<p>元素，正如您所說的那樣不是您的解決方案。

最後，假設我提到的所有內容都適用於HTML 4和XHTML 1，這是安全的。對於它的價值，這個概念在XHTML 2中進行了探索，這將允許<p>元素包含任何其他類型的內容。