Foundation 顶部导航栏
顶部导航栏放在页面头部:
实例
尝试一下 »
实例解析
使用 创建标准工具条。 .title-area 类定义了网站logo区域 (必须防止 li.name 内) 。屏幕变小后你就可以看到一个 "menu" 按钮。 Foundation 的菜单会根据屏幕尺寸自动折叠和延展:
小屏幕上,由于尺寸的原因很多选项会被隐藏。 li.toggle-topbar menu.icon 类创建了一个菜单的按钮,点击它可以显示被隐藏的选项。
提示: 重置浏览器窗口查看效果。
.top-bar-section 定义了导航的链接部分。 .left 类指定链接左对齐。 .active 类用于显示选中的项,背景为蓝色。
提示: 如果你想导航链接右对齐可以将 .left 修改为 .right :
实例