Javascript HTML、CSS、JS响应下拉菜单

首先，我想为我的语法错误道歉。 我的问题是，我用CSS和JavaScript制作了一个HTML响应式下拉菜单，但是当我将网页缩小到600px以下时，除了下拉部分，其他一切都正常工作。它显示了菜单的所有主要部分，这里有“Kezdőlap”、“Rajzok”、“Fesmények”等，但没有显示“Fekete fehér grafikák”等等。因此，我所指的

ul

li

ul

li

部分。当宽度小于600px时

我必须使这个代码更好，以显示一切。下面是HTML部分：

<nav>
    <ul class="menu">
        <li><a href="#">Kezdőlap</a></li>
        <li>
            <a href="rajzok.html"><span>Rajzok</span></a>
            <ul class="menu">
                <li><a href="rajzok.html">Fekete-fehér grafikák</a></li>
                <li><a href="szinesrajzok.html">Színes képek</a></li>
                <li><a href="negative.html">Negatív rajzok</a></li>
            </ul>
        </li>
        <li>
            <a href="festmenyek.html"><span>Festmények</span></a>
            <ul>
                <li><a href="festmenyek.html">Fekete-fehér</a></li>
                <li><a href="szinesfestmenyek.html">Színes</a></li>
            </ul>
        </li>
        <li><a href="kapcs.html">Kapcsolat</a></li>
                <li><a href="insp.html">Inspiráció</a></li>
                <li><a href="other.html">Egyéb alkotások</a></li>
                <li class="ikon"><a href="javascript:void(0);" onclick="myFunction()">&#9776;</a></li>
    </ul>
</nav>

而JS：

function myFunction()
{
     document.getElementsByClassName("menu")[0].classList.toggle("kibont");
}

---

您正在隐藏列表中不在第一位的任何

li

nav li:not(:first-child) {display: none;}

---

因此，如果您希望显示其他

li

s，则需要更改它。

如果我将其更改为显示：阻止或删除此行，它将显示主第一级中的所有li-s，但我不想这样做，但我想在li-s中显示第二个ul的li-s。你明白我的意思吗？你可以在你的媒体查询中创建一个css规则，比如

nav li.hidden-small{display:none；}

，然后把

hidden small

类放在你想隐藏的任何地方。我的问题是当它显示第一个ul中的所有li-s时，我无法在子菜单之间进行选择，因为它只显示主要部分…对不起，它太模糊了。如果你可以更新你的问题，更详细地了解你想要什么，甚至是一个JSFIDLE，那会很有帮助好的，那么，明天我将上传所有内容和一个视频，来展示我的问题。非常感谢你！

nav li:not(:first-child) {display: none;}