Bootstrap 3 - 我的断点是对的吗?网站看起来很奇怪,宽度为780

时间:2013-11-25 18:29:02

标签: css twitter-bootstrap

我正在这个网站上工作:

http://stephaniebertha.com/indev/solartrak/

我似乎遇到了断点和一般宽度响应布局的问题。当你调整它的大小并开始下降到780宽度时,布局中断并且看起来很奇怪(菜单变为浅灰色)。

这些是我在custom.css中的媒体查询(按此顺序):

  • max-width:480px
  • min-width:481px
  • min-width:769px

这是对的吗?我应该按此顺序进行吗?任何帮助你可以抛出我的方式会有所帮助。谢谢!

2 个答案:

答案 0 :(得分:0)

我认为你需要重新组织你的css,更好地考虑你想要的所有设备尺寸以及你不需要的规则

实施例 在您的custom.css中,您有此规则

@media only screen and (min-width: 769px) {

.navbar-default {
background: none;
border: 0 !important;
}

header.main {
height: 42px;
background: #f7941d;
}

导航栏的颜色不应该在@media规则中,这就是导航变灰的原因是小屏幕

并且还阅读了引导网格的文档,它将为您提供很多帮助

答案 1 :(得分:0)

Bootstrap 3的断点可以在这里自定义: http://getbootstrap.com/customize/

在标题“媒体查询断点”和“布局和网格系统”下...最好使用自定义版本,以便您选择与您相关的文件,并编译自己的自定义构建Bootstrap。

您可以查看bootstrap.css文件,找出断点的设置位置。如果你在样式表中使用相同的,那么休息时间应该匹配!

//您的链接不再存在,所以我担心我无法回答有关此问题的问题。