引导程序中的媒体查询,不允许我更改导航的大小和颜色

时间:2016-02-07 21:29:39

标签: html css html5 twitter-bootstrap css3

我正在玩引导程序,并在页面变小时使用一些媒体查询来编辑我的一些导航栏设置。我试图让它成为导航周围的背景颜色变成粉红色而文本是白色但由于某种原因这不会发生。

我也试图做到这一点,当它变得越来越小时,引导程序有一个图标栏,你可以按下它就像一个下拉菜单,但是当它到达移动版本并且出于某种原因我的方式很大不能使它看起来更小。这是导航的实际文本而不是小图标

CSS:

@media only screen and (max-width: 768px) {
  .navbar-default .navbar-nav > li > a:hover,
   .navbar-default .navbar-nav > li > a:focus {
        background-color: #ff00ff;
        font-size: 15px;
        padding: 5px;
}
}

再次对不起,如果这是一个简单的解决方案,但我刚刚开始学习使用bootstrap和所有这些,所以这对我来说都是新的。对此的任何帮助都会很棒。

1 个答案:

答案 0 :(得分:1)

这是因为其他一些风格正在覆盖你的CSS。 您应该使用Chrome的DevTools之类的检查员来查看这种情况发生的位置。

如何使用!important临时强制你的风格?

    background-color: #ff00ff !important;
    font-size: 15px !important;

当然这不是最佳做法,请参阅:https://css-tricks.com/when-using-important-is-the-right-choice/