我正在一个导航栏上工作,在我的导航链接上的悬停突然停止工作!!它仍然在我的徽标中作为光标工作:指针,但不是在我的导航链接悬停!!
Navbar component:
<nav>
<div className="itemL">
<a href="#">mjshubham21</a>
</div>
<div className="itemR">
<ul>
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#projects">Projects</a>
</li>
<li>
<a href="#contact">Contact Me</a>
</li>
<li>
<a href="#about">About Me</a>
</li>
</ul>
</div>
</nav>
styles.css:
nav {
display: flex;
justify-content: space-around;
align-items: center;
padding: 1.3rem 0.5rem;
height: 1.3rem;
background: rgb(2, 0, 36);
background: linear-gradient(
90deg,
rgba(2, 0, 36, 1) 0%,
rgba(9, 9, 189, 1) 73%,
rgba(0, 212, 255, 1) 100%
);
}
.itemL a {
text-decoration: none;
color: aliceblue;
}
.itemR ul {
display: flex;
flex-direction: row;
list-style: none;
}
.itemR ul a {
text-decoration: none;
color: aliceblue;
margin: 0.7rem;
}
.itemR ul a:hover {
color: rgb(7, 253, 60);
cursor: pointer;
}
x1c 0d1x我已经检查了css文件是否被链接,它是...但是现在我在itemR类的li上有这个悬停错误。
我想让我的css在导航栏中像以前一样工作。
1条答案
按热度按时间pw9qyyiw1#
您的链接嵌套在
<nav>
标记中。例如:JSFiddle