Question

我没有什么问题，我为下拉菜单制作了一些代码，因为我需要学习它，但是我发现了一些错误而且我无法解决它，我正在尝试一小时但仍然没有，如果你试图从下拉列表：对Postava我的破坏，尝试将光标移动到破坏的右上角，然后你会看到HREF LINK不工作+它下拉“Postava II”，只有当你移动光标时才必须下拉“波斯塔瓦一世”，你能帮我解决一下吗？这是http://jsfiddle.net/3qLu04sh/

HTML

<!DOCTYPE html> 
<html lang="cs-CZ"> 
    <head>
        <meta charset="UTF-8"> 
        <meta name="generator" content="Rostislav Danko">
        <link rel="stylesheet" href="Web.css">
        <title>Rostislav Danko</title>
    </head>
    <body>
        <div id="web">
            <div id="menu">
                <nav>
                    <ul id="ulid">
                        <li class="liclass"><a href="index.html">Hlavní stránka</a></li>
                        <li class="liclass"><a href="filmy_a_serialy.html">Filmy a seriály</a>
                            <ul id="ulid1">
                                <li class="liclass"><a href="filmy_a_serialy_tbb1.html">The Breaking  bad</a>
                                    <ul id="ulid2">
                                        <li class="liclass"><a href="postava.html">PostavaI</a>
                                            <ul id="ulid3">
                                                <li class="liclass"><a href="filmy_a_serialy_tbb1.html">PostavaII</a></li>
                    </ul>
                </nav>
            </div>
        </div>
    </body>    
</html>

CSS

ul li {
    display: block;
    float: left;
    background: #0F6;
    border-radius: 0px; 
    border: 3px solid #000;     
}
ul li a {
    text-decoration: none;
    color: #000;
    display: block;
    padding: 10px 5px 5px 5px;
    text-align: center;
    font-size: 25px;    
}
ul li:hover {
    background: #0FF;   
}
ul li:hover a {
    color: #000;
}
.liclass {
    width: 294px;
    height: 50px;
}
.liclass a {
    width: 294px;
}
#ulid { 
    width: 1200px;
    height: 55px;
    margin-left: -43px;
}
#ulid1 { 
    margin-left: -44px;
    position: relative;
    top: 10px;
    display: none;
}
#ulid1 a { 
    height: 40px;
}
.liclass:hover #ulid1 {
    display:block;
}
#ulid2 { 
    margin-left: 257px;
    position: relative;
    top: -58px;
    display: none;
}
#ulid2  { 
    height: 40px;
}
#ulid1:hover #ulid2 {
    display:block;
}
#ulid3 { 
    margin-left: -43px;
    position: relative;
    top: -3px;
    display: none;
}
#ulid3  { 
    height: 40px;
}
#ulid2:hover #ulid3 {
    display:block;
}
#menu {
    position: relative;
    top: 100px;
    width: 1200px;
}
#web {
    border-style: solid;
    background: #0F3;
    width: 1194px;
    height: 800px;
    margin:0 auto; 
    position: relative;
}

Answer 1

看起来您的ul＃ulid2与包含＆＃34; Breaking Bad＆＃34;的列表项重叠。链接。删除这些行

#ulid2  { 
    height: 40px;
}

你应该能够解决这个问题。我确定你可以通过许多其他方式修复它，但这个似乎可以解决问题。

下拉菜单href修复

1 个答案: