这两天整理一下 WebBroker 写的 CMS 的代码，清理一下页面框架。
页面框架使用了 Bootstrap V3 （V4 出来了，但网上的例子代码，在 V4 底下呈现出来会有问题，在 V3 底下没问题）。
页面抬头的主菜单，在 Bootstrap 里面叫做导航条。这个导航条可以随着页面向上滚动而一起滚动，也可以固定置顶，页面滚动时它始终显示在页面顶部。
导航条固定置顶，是给导航条的 class 里面添加：class .navbar-fixed-top, 比如在我自己的例子代码里，就是：
<div class="navbar navbar-inverse navbar-fixed-top">
然后，在增加了固定置顶的属性后，页面正文的顶部，就会被这个导航条遮住。要让正文顶部下移，给页面的 <Body> 添加 style 的属性：<body style="padding-top:50px">
直接在页面里面写：：<body style="padding-top:50px">, 就要每个页面都要写。因此最好写到外部 css 文件里面。
在外部 CSS 文件里面写：
body{padding-top: 50px} 在 FireFox 浏览器底下效果出来了，在 Chrome 底下没有效果。网上查了一下,查到：http://www.miaojingyun.com/post/286.html，应该写成：
body {padding-top: 50px;
overflow:hidden;
}
加上 overflow:hidden; Chrome 底下效果出来了。FireFox 效果仍然在。多谢这位博客主人：苗景云
-----------------------------------
又及：
这里为 Body 增加了一个 padding 以后，整个页面长度超出浏览器高度时，浏览器不会出滚动条了。
因此，要换个解决办法：
在导航条的底下，增加一个 div，给它的 css 里面，设置一个最小高度，也就是出来一个空白的高度：
<div class="Splitter"> </div>
.Splitter{
min-height: 52px;
}
这个办法测试结果OK。
页面内容在这个 div 底下。这样一来，整个页面内容都向下偏倚了 52 个像素，内容的顶部就不会被导航条遮蔽了。
1311
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
