合并两个HTML文件

Question

我有两个单独的HTML文件，它们都有不同的css和javascript。一个文件是响应式汉堡菜单，另一个是桌面和笔记本电脑下拉菜单。我想知道是否有一种方法可以使它在设备小于700px时从完整的导航栏切换到汉堡菜单。我必须将两个菜单放在一个文件中吗？

Answer 1

要从完整导航栏切换到汉堡菜单，请检查CSS @media规则。

@media screen and (min-width: 700px) {
    /* 
      Your code here (e.g burger menu class set to active)..
    */
}

Answer 2

简短回答：您不必将两个菜单放在一个文件中。

您有几种选择：

1. [首选项] 您在结构上对菜单进行一次标记。然后，您可以在CSS中使用Dictionary lookup. Example: foo["bar"] Attribute lookup. Example: foo.bar List-index lookup. Example: foo[bar] 个查询，以确定设备宽度@media和设备宽度> 700px时的菜单显示。

2. 您可以使用称为RESS（响应式设计+服务器端组件）的技术来加载一个菜单或另一个菜单。你可以相对简单地使用一小段if-else逻辑和2个PHP服务器端包括。