html – Twitter-bootstrap 3在窗口大小调整时添加侧边栏重叠内容,也是页脚

html – Twitter-bootstrap 3在窗口大小调整时添加侧边栏重叠内容,也是页脚,第1张

概述当我使用affix for bootstrap 3并调整窗口大小时,我遇到了重叠侧边栏的问题.有没有办法添加一些CSS类,以便不是重叠列,菜单粘贴到顶部? 该列也与页脚重叠.任何帮助将不胜感激.似乎很多人都有同样的问题. 这是HTML: <div class="container"><div class="row"> <div class="col-md-4 column"> 当我使用affix for bootstrap 3并调整窗口大小时,我遇到了重叠侧边栏的问题.有没有办法添加一些CSS类,以便不是重叠列,菜单粘贴到顶部?

该列也与页脚重叠.任何帮助将不胜感激.似乎很多人都有同样的问题.

这是HTML:

<div ><div >    <div >                <ul ID="sIDebar"  data-spy="affix" data-offset-top="130">              <li><a href="#software"><b>Software</b></a></li>                    <ul>                       <li><a href="#features">Features</a></li>                       <li><a href="#benefits">Benefits</a></li>                       <li><a href="#costs">Costs</a></li>                    </ul>           </ul>    </div>    <div >            <p>blah,blah,blah</p>            <hr>          <a  ID="top" name="software"></a>            <h2 >Software</h2> <p> blah,blah...</p><br><br>    </div>   </div>  </div>

这是CSS:

#sIDebar.affix-top {position: static;}#sIDebar.affix {position: fixed;top: 100px;}
解决方法 演示: http://bootply.com/104634

当屏幕宽度大于992像素(bootstrap col-md- *开始垂直堆叠的断点)时,您应该只应用词缀.

.affix-top,.affix{    position: static;}@media (min-wIDth: 992px) {  #sIDebar.affix-top {  position: static;  }  #sIDebar.affix {  position: fixed;  top: 100px;  }}

此外,如果要在较小的宽度上使用词缀,可以将列更改为col-sm- *或col-xs- *.

总结

以上是内存溢出为你收集整理的html – Twitter-bootstrap 3在窗口大小调整时添加侧边栏重叠内容,也是页脚全部内容,希望文章能够帮你解决html – Twitter-bootstrap 3在窗口大小调整时添加侧边栏重叠内容,也是页脚所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1081610.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-27
下一篇 2022-05-27

发表评论

登录后才能评论

评论列表(0条)

保存