zoukankan      html  css  js  c++  java
  • bootstrap-导航条

    默认样式的导航条

    导航条是在您的应用或网站中作为导航页头的响应式基础组件。它们在移动设备上可以折叠(并且可开可关),且在视口(viewport)宽度增加时逐渐变为水平展开模式。

    两端对齐的导航条导航链接已经被弃用了。

    导航条内所包含元素溢出

    由于 Bootstrap 并不知道你在导航条内放置的元素需要占据多宽的空间,你可能会遇到导航条中的内容折行的情况(也就是导航条占据两行)。解决办法如下:

    1. 减少导航条内所有元素所占据的宽度。
    2. 在某些尺寸的屏幕上(利用 响应式工具类)隐藏导航条内的一些元素。
    3. 修改导航条在水平排列和折叠排列互相转化时,触发这个转化的最小屏幕宽度值。可以通过修改 @grid-float-breakpoint 变量实现,或者自己重写相关的媒体查询代码,覆盖 Bootstrap 的默认值。

      依赖 JavaScript

      如果 JavaScript 被禁用,并且视口(viewport)足够窄,致使导航条折叠起来,导航条将不能被打开,.navbar-collapse 内所包含的内容也将不可见。

      修改视口的阈值,从而影响导航条的排列模式

      当浏览器视口(viewport)的宽度小于 @grid-float-breakpoint 值时,导航条内部的元素变为折叠排列,也就是变现为移动设备展现模式;当浏览器视口(viewport)的宽度大于@grid-float-breakpoint 值时,导航条内部的元素变为水平排列,也就是变现为非移动设备展现模式。通过调整源码中的这个值,就可以控制导航条何时堆叠排列,何时水平排列。默认值是 768px (小屏幕 -- 或者说是平板 --的最小值,或者说是平板)。

  • 相关阅读:
    只要7步,就能将任何魔方6面还原
    写一篇文章测试一下
    关于80端口被占用
    打造只能输入数字的文本框
    windows下MySql忘记密码的解决方案
    linq to xml 操作sitemap
    C#设计模式——工厂方法模式(Factory Method Pattern)
    C#设计模式——单件模式(Singleton Pattern)
    C#设计模式——迭代器模式(Iterator Pattern)
    C#设计模式——状态模式(State Pattern)
  • 原文地址:https://www.cnblogs.com/xiongzuyan/p/5950673.html
Copyright © 2011-2022 走看看