html - 无法将 div 或文章元素放入 anchor 内

Question

在 HTML5 中现在“可能”或允许将 block 元素放在 anchor 内，但由于某些原因它不起作用。这是代码:

<a href="#"><div>
                <figure>
                    <img src="prodimg/senseo-m.jpg"/>
                </figure>
                <div class="proddetail">
                    <header>
                        <hgroup>
                            <h2>Koffiepadsysteem</h2>
                            <h1>Senseo</h1>
                        </hgroup>
                        <div class="clear"></div>
                    </header>
                    <span class="price">&euro; 79,99</span>
                    <span class="elders">elders &euro; 89,99</span>
                    <span class="bespaart">u bespaart &euro; 15%</span>
                    <a href="#"><span class="meerinfo">Meer info</span></a>
                </div>
            </div></a>

当我检查 firefox 或 chrome 中的代码时，我得到了这个结果:

<a href="#"></a>
<div><a href="#">
                <figure>
                    <img src="prodimg/senseo-m.jpg">
                </figure>
                </a><div class="proddetail"><a href="#">
                    <header>
                        <hgroup>
                            <h2>Koffiepadsysteem</h2>
                            <h1>Senseo</h1>
                        </hgroup>
                        <div class="clear"></div>
                    </header>
                    <span class="price">€ 79,99</span>
                    <span class="elders">elders € 89,99</span>
                    <span class="bespaart">u bespaart € 15%</span>
                    </a><a href="#"><span class="meerinfo">Meer info</span></a>
                </div>
            </div>

这几乎不错，但某些地方仍然不可点击。知道什么时候可以在这里完成吗？

Answer 1

发现问题!

将 block 元素包裹在 anchor 中是可能的，但您不能将另一个 anchor 也放在那里。然后它就坏了。

所以父 anchor 不能包含子 anchor 。