Html 将 <div> 或 <span> 放在 <button> 中是否在语义上不正确？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12982269/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it semantically incorrect to put a <div> or <span> inside of a <button>?
提问by Joshua Sortino
I'd like to do the following, but is it semantically correct?
我想做以下事情，但它在语义上是否正确？
<button>
<div></div>
<div></div>
</button>
回答by aecolley
The current HTML5 draft says it is incorrect.
当前的 HTML5 草案说它不正确。
http://www.w3.org/TR/2012/WD-html5-20120329/the-button-element.html#the-button-elementsays that a <button>must contain only Phrasing content. Phrasing content is defined as including <span>but not <div>.
http://www.w3.org/TR/2012/WD-html5-20120329/the-button-element.html#the-button-element说 a<button>必须只包含短语内容。短语内容被定义为包括<span>但不包括<div>。
回答by Kris Hollenbeck
No it is not valid. You can verify it at W3C.
不，这是无效的。您可以在 W3C 验证它。
http://validator.w3.org/#validate_by_input+with_options
http://validator.w3.org/#validate_by_input+with_options
Paste this in the direct input and then validate.
将其粘贴到直接输入中，然后进行验证。
<!DOCTYPE html>
<button>
<div></div>
<div></div>
</button>
Set the UTF8 encoding and select HTML5 when testing at W3C.
在 W3C 测试时设置 UTF8 编码并选择 HTML5。
回答by shennan
I'm sure this is heretical, but if you wanted to validate you could always use <span>elements inside your button and style them like a <div>:
我确定这是异端邪说，但如果你想验证你总是可以<span>在你的按钮中使用元素并将它们设置为<div>：
button span {
display: block;
}<button>
<span>I'm a div</span>
<span>I'm a div</span>
<span>I'm a div</span>
</button>This validated today. Whether it will validate in ten years is another story...
这在今天得到证实。它是否会在十年内验证是另一回事......
回答by Ollie Williams
回答by Quentin
Div and span elements do not have any semantics. They are genericblock and inline elements. The only question you need to ask yourself about semantics when you are using them is Is there an element with better semantics for this content?.
Div 和 span 元素没有任何语义。它们是通用块和内联元素。在使用语义时，您需要问自己的关于语义的唯一问题是，是否有针对此内容的元素具有更好的语义？.
That said, it is incorrect to place a div inside a button for reasons unrelated to semantics. The specificationsays about the content model for buttons:
也就是说，由于与语义无关的原因，将 div 放在按钮内是不正确的。该规范说，关于按钮的内容模型：
Phrasing content, but there must be no interactive content descendant.
短语内容，但不得有交互式内容后代。
… a span is phrasing content but a div is not.
......跨度是措辞内容，但 div 不是。
