覆盖twitter bootstrap由于某种原因不起作用

时间:2013-12-02 19:27:53

标签: css twitter-bootstrap

所以我的页面标题如下所示:

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular-route.min.js"></script>
<script src="js/app.js"></script>
<link href="css/style.css" rel="stylesheet">

并且在style.css里面我有:

.navbar-default {
    background-color: #FDFDFD;
    border-color: #E7E7E7;
}

然而,当页面加载时,我看到bootstrap css类覆盖了我的,反之亦然。我错过了什么吗?可能是因为我正在使用缓存版本(我不这么认为)。见附图

enter image description here

请告知。

2 个答案:

答案 0 :(得分:2)

可能你应该指定更多你的css规则,如

#something .nav div.navbar-default

https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

答案 1 :(得分:0)

在CSS规则之后但在CSS规则中的半冒号之前添加!important