framework7中导航栏和工具栏布局

在需要导航栏和工具栏的情况

布局：

静态布局:

navbar,toolbar 元素是page-content元素的子元素，所以导航栏和工具栏在滚动时随内容一起滚动。

固定布局：

navbar,toolbar元素是page元素的子元素，所以是固定的，不随内容一起移动。

需要在page元素得class中添加navbar-fixed,toolbar-fixed.

穿透布局：

这种布局方式被广泛使用，实现在不同页面间切换时导航栏和工具栏不变。通过这种布局可以实现动态导航。记住要在视图初始化时启动它，dynamicNavbar：true;

navbar,toolbar元素是view元素得子元素，和pages元素是胞元素，并且pages元素class属性设置navbar-through toolbar-through.

混合布局：

可以使用穿透的导航栏和固定的工具栏，这种情况是，navbar元素为view元素得子元素，toolbar元素为的子元素，在pages元素得class上添加navbar-through toolbar-fixed.

无导航栏/工具栏

当然，如果你不需要导航栏或工具栏，你大可不必包含它们，并且不用在page/pages/view中添加相应的类（“"navbar-fixed”，“navbar-through”，“toolbar-fixed”，“toolbar-through”）

总结，布局类设置的层次结构如下：

静态

.view .pages .page .page-content .navbar // other page content .toolbar

Fixed

.view .pages.navbar-fixed.toolbar-fixed .page .navbar .page-content .toolbar

Through

.view .navbar .pages.navbar-through.toolbar-through .page .page-content .toolbar