html - H1のHTMLH3要素

Question

<h1>Hello<h3>World</h3></h1>

これが私のhtmlの場合、すべてのブラウザがh1の外にh3を削除します。ソースが表示されている場合

<h1>Hello</h1>
<h3>World</h3>

私の知る限り、h1とh3はどちらもブロック要素です。ブロック要素を別のブロック内に配置できないのはなぜですか。

http://jsfiddle.net/J3dP4/

Answer 1

From w3.org on the h1 element :

Permitted contents :

Phrasing content

The phrasing elements are listed here :

a or em or strong or small or mark or abbr or dfn or i or b or s or u or code or var or samp or kbd or sup or sub or q or cite or span or bdo or bdi or br or wbr or ins or del or img or embed or object or iframe or map or area or script or noscript or ruby or video or audio or input or textarea or select or button or label or output or datalist or keygen or progress or command or canvas or time or meter

h3 isn't among them.

So no, you can't put a h3 in a h1.

Answer 2

<h1> and <h3> are both the same kind of block element, the heading level. It would make no difference if it "worked" as you intended, the result would be the same.

Same happens all the way through <h1> to <h6>.

Answer 3

There's why you shouldn't do that, and why you can't do that.

For why you shouldn't do that, see dystroy's answer.

Why you can't do that, it is simply that the parse rules don't let you. But that's only because you are trying to make one h? element the direct child of another h? child. If it's a descendant but not a direct child then the parse rules don't stop you. For example,

<h1>Hello<div><h3>World</h3></div></h1>

Jsfiddle

will put an h3 element inside a div element inside an h1 element. Note however, that this arrangement is still invalid and you should not do it.