W3C中文教程
全球最大最新的中文 Web 技术教程
HTML CSS SQL PHP COLORS MYSQL BOOTSTRAP
 

Bootstrap 附加导航



附加导航插件

附加导航(Affix)插件允许某个 <div> 固定在页面的某个位置。您也可以在打开或关闭使用该插件之间进行切换。一个常见的例子是社交图标。它们将在某个位置开始,但当页面点击某个标记,该 <div> 会锁定在某个位置,不会随着页面其他部分一起滚动。

Example 1) 固定导航条:

Example 2) 固定侧边栏:

使用附加导航,当我们在页面上下滚动时,菜单始终是可见的,并且锁定在它的位置。


如何创建附加导航菜单

下面是如何创建附加导航菜单的例子:

Example

<nav class="navbar navbar-inverse" data-spy="affix" data-offset-top="197">
尝试一下 »

下面是如何创建垂直附加导航菜单的例子:

Example

<ul class="nav nav-pills nav-stacked" data-spy="affix" data-offset-top="205">
尝试一下 »

Complete Bootstrap Affix Reference

For a complete reference of all affix methods and events, go to our Bootstrap JS Affix Reference.