Question

我正在为我的网站创建html / css，而且链接不是“可点击的”。

当我在“ul＃menu”css中删除“float：left”时，链接起作用。否则它不会。

        <ul id="menu">
            <li><a href="www.facebook.com" class="active">Home</a></li>
            <li><a href="www.facebook.com">Order</a></li>
            <li><a href="www.twitter.com">How it works</a></li>
            <li><a href="#">FAQ</a></li>
            <li><a href="#">About urrrs</a></li>   
            <a href="www.facebook.com">order</a>            
        </ul>



ul#menu{
    float: left;
    margin-left: 20px;
    margin-top: -290px;
}

ul#menu li a {
    text-decoration:none;
    color:#e2281f;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:22px;
    line-height:32px;
}

ul#menu li a.active, ul#menu li a:hover {
    background-color:#e2281f;
    color: white;
}

我的网页位于：http://foodchute.com/

Answer 1

试试这个：

        <ul id="menu">
            <li><a href="www.facebook.com" class="active">Home</a></li>
            <li><a href="www.facebook.com">Order</a></li>
            <li><a href="www.twitter.com">How it works</a></li>
            <li><a href="#">FAQ</a></li>
            <li><a href="#">About urrrs</a></li>   
            <a href="www.facebook.com">order</a>            
        </ul>



ul#menu{
    position:relative; /* <- important bit here */
    z-index:1; /* <- important bit here */
    float: left;
    margin-left: 20px;
    margin-top: -290px;
}

ul#menu li a {
    text-decoration:none;
    color:#e2281f;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:22px;
    line-height:32px;
}

ul#menu li a.active, ul#menu li a:hover {
    background-color:#e2281f;
    color: white;
}

Answer 2

因为你有一个重叠的div #shopping。

将此添加到您的#menu：

position:relative;
z-index:2

这到#shopping

z-index:1

Answer 3

如果您尝试使用选项卡，它们都可以正常工作，您可以选择它们并按Enter键重定向！只有你的CSS样式与链接重叠，如果我做对了，尝试使用它，它会使事情有效（不是CSS和HTML专家，但我想它可以帮助）。

HTML链接无法正常工作

3 个答案: