0
私のメニューに問題があります。リンクに "nav"クラスを追加すると、要素全体のホバーが白くなります。変更できません。私がnavを削除すると、簡単にスタイルを設定できます。ブートストラップのCSSスタイリングリンク3
アイデア？
<body id="home" ng-controller="IndexController">
<nav class="navbar navbar-dark bg-dark">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<a class="navbar-brand" ng-click="change('main')" href="#">Main Page</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li ng-click="checkIt()"><a href="#">Stuff 1</a></li>
<li><a href="#">Stuff 2</a></li>
<li><a href="#">Stuff 3</a></li>
<li><a href="#">Stuff 4</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Registration</a></li>
<li><a href="#">Log in</a></li>
</ul>
</div>
</div>
</nav>
と私のCSS：
$bg-color: #333;
$font-color: #fff;
$primary-color: #008ed6;
$dark-overlay: rgba(21, 21, 21, 0.8);
$icon-size: 30px;
body{
background-color: $bg-color;
color: $font-color;
}
.container{
padding: 8px;
}
.navbar{
border-bottom: $primary-color 3px solid;
opacity: 0.8;
background-color: $dark-overlay;
font-color: white;
}
#home{
min-height:700px;
background-size: cover;
background-attachment: fixed;
.fa{
color:$primary-color;
background: #fff;
padding: 4px;
border-radius: 5px;
font-size: $icon-size;
}
}
.navbar-brand{
color: white;
:hover{
color: darken(white, 15%);
}
}
a{
color: white;
}
a:hover {
color: darken(white, 15%);
text-decoration: none;
}
私は、フォントのデフォルトの色は青だったので、あまりにもスタイルを持っていました。 navbar-headerにnavクラスを追加すると、正しく動作しています。
@edit - CSSルールを変更するか、使用することができ、親>子>子>子からルールにアクセスしてください（私はコメントでそれを説明した）この画面で
「リンク」に「nav」クラスを追加しました** **リンク**に** NAV **のクラスを追加しようとしていますか？ブートストラップのデフォルトメニューコードを見てください。 'nav'のクラスはリンクに属していません...あなたの問題です。 – ProEvilz