Question

我正在新的公司网站上使用Zurb Foundation 5，我正在建设中。

我正在使用Off Canvas菜单来显示较小的/触摸屏，并且还希望为更大的屏幕提供更多“传统”菜单 - 您将悬停在主选项上并获得更多弹出窗口的类型菜单选项。

我在ol标签中定义了菜单，其中包含嵌套ol的子菜单。

这一切都正常......但我的问题是这样做，我不得不复制标记。

我的结构定义如下：

<nav>
    <aside class="left-off-canvas-menu">
        <!-- Full menu markup here -->
    </aside>
    <a class="exit-off-canvas"></a>
</nav>

<nav id="mainNav" class="row show-for-large-up">
    <!-- Full menu markup also here -->
</nav>

我有以下问题

SEO提供两次链接是不好的。这只是一个问题，我不知道这是否真的是一个问题。
我臃肿了源头 - 将所有请求发送两次，并允许用户代理决定要显示的内容和隐藏的内容。我特别想把最小标记发送到手机上。
维护。我正在使用ASP.NET MVC所以我已经使用了部分视图，因此我只是一次定义结构并将其注入两次;但如果我没有使用它，那么维护我的菜单有两点 - 这似乎不是一个好习惯。

有什么想法？这是对的吗？

Answer 1

你必须添加

<nav class="left-off-canvas-menu hide-for-medium-up">
    <aside >
        <!-- Full menu markup here -->
    </aside>
    <a class="exit-off-canvas"></a>
</nav>

<nav id="mainNav" class="row show-for-large-up">
    <!-- Full menu markup also here -->
</nav>

或 class =“left-off-canvas-menu hide-for-large-up” 哪个你喜欢应该这样做我认为

与Zurb Foundation重复导航标记

1 个答案: