塊之間的空白區域

Question

CSS'white-space'屬性是否應該能夠影響塊元素之間的空白？

例如，在如下“ DOM中的空白 ”中用作示例的文檔中， </h1>和<p>之間有空格：

<!-- My document -->
<html>
<head>
  <title>My Document</title>
</head>
<body>
  <h1>Header</h1>
  <p>
    Paragraph
  </p>
</body>
</html>

這個空格通常被刪除; 例如， XHTML規范表明符合要求的用戶代理必須滿足以下所有條件：

在'xml：space'屬性設置為'preserve'的元素中，用戶代理必須保留所有空格字符不變（除了前導和尾隨空白字符，應刪除）。 否則，根據以下規則處理空格：

應刪除塊元素周圍的所有空白。

必須刪除塊元素內的前導和尾隨空格。

必須將塊元素中的換行符轉換為空格（“xml：space”屬性設置為“preserve”時除外）。

必須將一系列空格字符縮減為單個空格字符（除非'xml：space'屬性設置為'preserve'）。

我的問題如下：

如果我在<body>上使用CSS white-space屬性，是否應該能夠保留塊元素之間的空格（例如</h1>和<p> ）？ 或者總是刪除塊之間的空格，而white-space屬性只影響塊內的空格？
XHTML規范說<body> 不能直接包含PCDATA （即文本）。 這是否意味着<body>標簽的直接子節點的空白（作為一種文本）總是無關緊要/被忽略，並且不能通過CSS啟用？ 如果是，並且上面示例中的</h1>和<p>之間的空格被忽略，因為它是<body>的直接子節點，如果有<div style="white-space: pre"> ，那么是否應該忽略空格<div style="white-space: pre">在<body> <div style="white-space: pre">直接<div style="white-space: pre">並包含所有其他元素？
“白色空間”處理模型以“任何直接包含在塊元素內（不在內聯元素內）的文本應被視為匿名內聯元素”開頭。 我應該了解純空格（沒有文字的空白）？
關於刪除內聯元素中的空格是否有規則（如果是，定義此規則在何處）？ 例如，按照以下順序<p>The <strong> lazy </strong> dog.</p>是否應刪除<strong>標記后面的空格？ （HTML 4規范對換行有一個規則 ;我想知道這個規則是否也適用於其他非線性空白空間，以及是否在任何XHTML或CSS規范中提及/定義/允許/假設此規則。）

Answer 1

你的問題肯定會讓我好奇。 我希望能夠對它們有所了解。

XHTML模式將以下三個元素聲明為preserve ：

STYLE
SCRIPT
PRE

這意味着所有其他容器元素應該已經抑制了它們周圍的空白。 你的Mozilla鏈接（ “DOM中的空白” ）說：

在Mozilla中，原始文檔的文本內容中的所有空格都在DOM中表示...

當運行具有大量空格和間隔的測試頁時，這一點變得明顯。 查看生成的代碼（您可以使用Web Developer工具欄執行此操作：選擇View Source - View Generated Source ）顯示“文本內容”表示HTML根標記內的所有內容。 因此，換句話說，最外層標記（ HTML ）上只有空格抑制。

在IE8中運行相同的頁面講述了一個略有不同的故事（按F12查看生成的源，在開發人員工具中按CTRL - G ）。 它們也不是100％一致，但比Firefox更符合要求。 他們不僅要壓制HTML元素，還要壓制其他所有東西（應該如此）。 他們注意到SCRIPT和STYLE元素的preserve規則，但仍然在中間留下了中斷。 在身體中，它用單個休息替換了多個休息時間。 單行上的嵌套DIV標記（及其內容文本）被拆分。

簡而言之，Firefox和IE8都不符合用戶代理 。

不，你不能用white-space屬性來抑制兩個標簽之間的空白（如果你真的想，你可能會用JavaScript / jQuery來做）。 white-space屬性指定如何處理元素內容部分中的空格（例如， white-space: nowrap防止文本換行）。

塊之間的空白區域

問題描述

1 個解決方案

解決方案1
1 2010-07-06 05:54:32

塊之間的空白區域

問題描述

1 個解決方案

解決方案1 1 2010-07-06 05:54:32

解決方案1
1 2010-07-06 05:54:32