严格的文档类型 - 表单和输入元素答案

【问题标题】：Strict doctype - form and input element严格的文档类型 - 表单和输入元素
【发布时间】：2011-02-28 06:46:57
【问题描述】：

有谁知道严格的文档类型不允许输入元素是表单元素的直接后代背后的原因。我觉得很烦人，我必须包装一个提交按钮，它是一个块级元素，里面有另一个块级元素，比如字段集或 div。但是，我无法在任何地方找到关于为什么会这样的答案。

【问题讨论】：

【解决方案1】：

因此，如果您尝试将输入直接放入没有容器元素的表单中，并在 xhtml 1.0 strict 下进行验证，您会收到以下警告：

文档类型不允许元素 “输入”在这里；缺少一个“p”， “h1”、“h2”、“h3”、“h4”、“h5”、“h6”、 “div”、“pre”、“address”、“fieldset”、 “ins”、“del”开始标签✉ 提到的元素是不允许的出现在你所经历的上下文中放置它；另一个提到的元素是唯一的两者都允许在那里并且可以包含提到的元素。这可能意味着你需要一个包含元素，或者可能你忘记了关闭前一个元素。

此消息的一个可能原因是你试图把一个块级元素（例如“

”或 "
") 内联元素（例如“”、“”或 "")。
如果您查看 W3C 对表单元素 (http://www.w3.org/TR/html4/interact/forms.html#h-17.3) 的定义，您会发现该元素的内容模型被定义为“%block”。

如果您点击“%block”链接 (http://www.w3.org/TR/html4/sgml/dtd.html#block)，该链接会将您带到定义为这些类型元素的元素。这些是：

<!ENTITY % block "P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT | BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

因此，如您所见，W3C 并未将输入或按钮定义为块级元素。您可以在该页面中搜索“input”并发现它的内容类型为“formctrl”：

<!ENTITY % formctrl "INPUT | SELECT | TEXTAREA | LABEL | BUTTON">

实际上，输入元素默认显示为比块更多的内联块，考虑到它们不会在它们之前/之后导致换行符。因此，不仅仅是内联元素和块级元素。

所以，最终，表单需要它的直接子元素成为块级元素，而输入元素不符合条件。我希望这一切都清楚了。

【讨论】：

是的，它确实提供了更多关于推理的洞察力，但是，我想我代表大多数开发人员，输入元素被视为块元素，并且在几乎所有浏览器和设置中都表现得如此.

是的，人们倾向于将元素视为块级或内联，但除了这两种之外，还有更多的变化。输入元素是块级的，因为它们具有高度和宽度你可以调整，但如果你有类似“输入名称：”的东西，它们都出现在同一行，不需要做任何浮动，所以它的行为就像一个内联元素。我自己，我将它们视为内联块元素。虽然我同意
或
或任何其他块级元素不需要进行验证，但我认为在

内应该没问题。

这个答案归结为，“规范是这么说的。”我觉得最不满意。 1）有什么可能的现实原因来限制表单的“内容模型”阻止，特别是如果还有一个“formctrl”选项也可用？！ 2) 我经常使用事实上的内联表单。我必须在块元素周围使用 CSS 才能做到这一点，这让我很生气。

@Brock “为什么会这样”的答案是因为运行 W3C 并且是 HTML 工作组成员的人认为应该是这样，但这是一个可怕的答案。此外，所有标签都定义了内容模型，这就是确定验证的方式，将正确的标签放在正确的位置。它提供了结构。

其实我认为标准已经在这里了。如果输入被定义为块级元素，这意味着，例如，单选按钮将在一行上，默认情况下该单选按钮的标签文本在下一行（没有特定的 CSS 来设置浮动/宽度等） .输入被定义为内联，因为它们通常自然地位于块内的解释性文本流等中。要获得有效的表单，只需将每个输入/标签组合（您正在使用标签，对吗？）放入表单元素内的块中，例如 div 或 p。恕我直言，没有错。