css - 我可以有一个具有不同父元素的 <input> 和 吗？

Question

例如:

<input type="checkbox" id="nav-toggle" />

<nav>
    Nav stuff
</nav>

<main>
   <label for="nav-toggle">Menu</label>
</main>

用于像这样的纯 css 菜单面板:http://codepen.io/jimahyland/pen/mAVGmj

它看起来工作正常，但是这种方法有什么根本性的错误吗？

Answer 1

是的，input 和 label 可以有不同的父级。

大多数标准 block 级元素，例如 body、div、article、section 和 放在一边，接受flow content , 其中包括 input和 label .

只要父级接受流内容或phrasing content , input 和 label 可以作为子元素存在。