Bootstrap可以改变导航栏的颜色，但不能摆脱颜色？

/*This is for the overall look of the page, what font and the repeated background image*/ 
 
body { 
 

 
    background-image: url("../Assets/crossword.png"); 
 
    font-family: Rockwell, "Courier New", Georgia, 'Times New Roman', serif; 
 

 
} 
 

 
/*This is just to get the main content of the page centered*/ 
 
#mainBody { 
 
    width: 80%; 
 
    margin: auto; 
 
    margin-top: 10px; 
 
} 
 

 

 
.navbar-custom { 
 
    background-color: none; 
 
}

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <!-- This is the title of the first page --> 
 
    <title></title> 
 
\t <meta charset="utf-8" /> 
 

 
    <!-- This is the viewport settings for bootstrap --> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
 

 
    <!-- These are the javascript, CSS, and jquery file scripts --> 
 
    <script src="Scripts/jquery-1.9.1.min.js"></script> 
 
    <script src="Scripts/bootstrap.min.js"></script> 
 
    <link href="Content/bootstrap.min.css" rel="stylesheet" /> 
 
    <link href="Content/MyStyleSheet.css" rel="stylesheet" /> 
 
</head> 
 
<body> 
 
    <div id="mainBody"> 
 
     
 
     <nav class="navbar navbar-inverse navbar-custom"> 
 

 
     </nav> 
 
      
 

 
      
 
     
 
    </div> 
 
     
 
    
 
</body> 
 
</html>

不知道为什么我有这个导航栏这么大的麻烦。尝试引导，因为它应该使事情变得更容易..

但我可以改变导航栏背景的颜色来说蓝色。但是，如果我给背景颜色没有。它什么也没做。

我已经尝试将其标记为重要的，我看到了使它成为navbar-default并且无法使其工作的建议。我只是想让背景变得透明而没有任何内容。

来源

2017-09-23 Justin Sinnard

none并不出彩，所以你不能把它作为背景色。您可以改用transparent。

您遇到的另一个问题是您的<nav>元素中的navbar-inverse类，它将获得更高的优先级。

您可以使用.navbar-custom.navbar-inverse来解决这个问题：

/*This is for the overall look of the page, what font and the repeated background image*/ 
 
body { 
 

 
    background-image: url("../Assets/crossword.png"); 
 
    font-family: Rockwell, "Courier New", Georgia, 'Times New Roman', serif; 
 

 
} 
 

 
/*This is just to get the main content of the page centered*/ 
 
#mainBody { 
 
    width: 80%; 
 
    margin: auto; 
 
    margin-top: 10px; 
 
} 
 

 

 
.navbar-custom.navbar-inverse { 
 
    background-color: transparent; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 
<div id="mainBody"> 
 

 
    <nav class="navbar navbar-inverse navbar-custom"> 
 

 
    </nav> 
 

 
</div>

来源

2017-09-23 23:35:15 Dekel

亲爱的上帝，这一切是，它的啤酒和巫师3时间哈哈 –

快乐帮:) – Dekel

为透明背景，你需要：

.navbar-custom { 
    background-color: transparent; 
}

来源

2017-09-23 23:34:17

Bootstrap可以改变导航栏的颜色，但不能摆脱颜色？

回答

相关问题