将主要元素和页脚元素包装在一起是不好的做法吗？

Question

我想重新创建此侧边菜单行为：

我目前有 HTML 个结构：

<body>
   <header>
      <nav>
         <ul></ul>
      </nav>
   </header>
   <main></main>
   <footer></footer>
</body>

我希望在调用侧边菜单后缩小所有可见区域，包括页脚（如果此时可见）。我正在考虑在 div 中包装 main 和 footer 并像在这个模型中那样缩放它：

但这不违背良好的HTML结构原则吗？什么标签最适合它？

代码需要在所有现代浏览器中运行。

Answer 1

您可以考虑几个想法。

仅在调用侧边栏出现时插入换行符div - 您将使用javascript打开侧边菜单的概率。您的 HTML 结构只会在打开侧边栏时生效。当 animation/state 关闭时，您可以移除包装 div.

缩放两个元素并将它们放在一起 - 你不需要将main和footer作为一个元素，尝试缩放它们向下并彼此靠近放置，使其看起来像一个元素。我知道这需要一些前后修正。但这意味着您根本不需要包装元素。

在页面加载后对页面进行截图 - 这是一个更具技术性的解决方案。有一些库可以截取当前视口并将其制作成图像。您可以截图并将它们放在导航元素中。我确实认为这不是最好的解决方案，但仍然值得一提。参见：http://html2canvas.hertzen.com/

Wrapping main and footer elements together is bad practice?