Html 我的导航栏没有悬停，链接也不工作，为什么不呢？

我的导航条没有链接，而且当我将鼠标悬停在导航条上时，导航条也不会工作

<header>
    <div class="row">
        <ul class="main-nav">
            <ul>
                <li class="active"><a href="">HOME</a></li>
                <li><a href="#">ABOUT</a></li>
                <li><a href="#">CONTACT</a></li>
                <li><a href="blog.html">BLOG</a></li>
                <li><a href="#">STUDY</a></li>
                <li><a href="#">STUDY</a></li>
            </ul>
        </ul>
    </div>

你能告诉我这个代码有什么问题吗 这就是上面说的那部分。主导航李a：悬停。

---

请告诉我我真的需要你我能解决的问题

我已经从我这边检查过了，链接似乎运行良好。我不知道为什么它在你的情况下不起作用。在下面的代码片段中，我对.main nav和.main nav li类做了一些更改，使它看起来比以前的笨拙而粘糊糊的navbar更好、更干净。请为结果运行代码段。希望这对你有所帮助

.行{ 最大宽度：1200px； 保证金：自动； } .主导航{ 浮动：对； 边缘顶部：30px； 背景色：0066ff； 宽度：100%； 填充：7px； } 主导航李先生{ 显示：内联块； } .主导航李，a{ 颜色：白色； 宽度：70px； 浮动：左； 填充：10px； 文本对齐：居中； 文字装饰：无； 字体系列：Roboto，无衬线； 字体大小：15px； } .主导航李。主动a{ 边框：1px纯白； } .主导航李a：悬停{ 边框：1px纯白； 背景色：达克朗格； }

.row {
max-width: 1200px;
margin: auto;
    }
.main-nav {
float: right;
margin-top: 30px;
    }
.main-nav li {
display: inline-block;
    }
.main-nav li, a {
color: white;
text-decoration: none;
padding: 5px 20px;
font-family: "Roboto", sans-serif;
font-size: 15px;
     }
 .main-nav li.active a {
border: 1px solid white;
     }
 .main-nav li a:hover {
border: 1px solid white;
background-color: darkorange;
     }