According to the documentation of the Bootstrap 3\'s navbar static-top,
Static top Create a full-width navbar that scrolls away with the page by add
navbar-static-top
removes the left,right and top border created by navbar-default
so that it looks better at the top of the page, whereas you might want to use just navbar-default
elsewhere on the page...
On the other hand, navbar-fixed-top
uses position:fixed
. If there is content on the page that extends below the viewport (as there is on most pages) the navbar-fixed-top
will remain stuck to the top, whereas the navbar-static-top
will scroll away. Since the navbar-fixed-top
is fixed, it requires the body to have padding-top so that it doesn't overlay page content...
As you can see when you scroll down in each example the top navbar responds differently.