Question

我的导航栏中的链接不起作用。文本显示出来，但我无法单击它。它可以在其他页面上运行，但不能在此页面上运行。

我尝试弄乱CSS，但是没有运气，因为它仍然不允许我单击链接。

这是我的html。

<nav>
    <ul>
        <li><a href="about.html" style="color: white; text-decoration: none;">About</a></li>
        <li>Portfolio</li>
        <li><a href="resume.html" style="color: white; text-decoration: none;">Resume</a></li>
        <li><a href="contact.html" style="color: white; text-decoration: none;">Contact</a></li>
        <li>Links</li>
    </ul>
</nav>

这是我的CSS：

body{
    background-image: url(images/city.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}
.container {
    position: relative;
    width: 70%;
    height: 100%;
    padding-bottom: 56.25%;
    margin-left: auto;
    margin-right: auto;
}
.box {
    position: fixed;
    left: 0;
    width: 70%;
    height: 100%;
    right: 0;
    margin: 3.8% auto;
    bottom: 0;
    top: 0;
    opacity: 0.9;
}
nav{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: black;
    opacity: 0.9;
    color: white;
}
ul {
    list-style-type: none;
    overflow: hidden;
}

li {
    float: right;
    margin-left: 15px;
    margin-right: 5px;
    position: relative;
    right: 5px;
}
div.head{
    text-align: center;
    position: absolute;
    left: 20px;
}
a:visited{
    color: white;
    text-decoration: none;
}

Answer 1

我将假设您的意思是，导航栏中的5个链接中，“链接”和“投资组合”文本对您而言是不可单击的，因为在我自己测试后，其他三个都可以。

在这种情况下，这可能非常明显，但是那两个列表项没有锚链接。

    <nav>
        <ul>
            <li><a href="about.html" style="color: white; text-decoration: none;">About</a></li>
            <li><a href="portfolio.html" style="color: white; text-decoration: none;">Portfolio</a></li>
            <li><a href="resume.html" style="color: white; text-decoration: none;">Resume</a></li>
            <li><a href="contact.html" style="color: white; text-decoration: none;">Contact</a></li>
            <li><a href="links.html" style="color: white; text-decoration: none;">Links</a></li>
        </ul>
    </nav>

链接在此页面的导航栏中不起作用，但在其他页面上也可以正常工作

1 个答案: