javascript - 在css中做一个下拉按钮

问题描述

我正在尝试在我的网站中加入一个下拉按钮，但我不知道为什么按钮的内容没有正确显示：

    <body> 
        <div class="topnav">
            <a id="inicio"  href="index.php">Inicio</a>
            <a id="contacto" href="login.php" >Login</a>
            <a id="contacto" href="registro.php">Registro</a>
            <a id="contacto" href="#" >Contacto</a>
            <div class="dropdown">
                <button onclick="myFunction()" class="dropbtn">Dropdown</button>
                <div id="myDropdown" class="dropdown-content">
                    <a href="#home">Iniciar sesion</a>
                </div>
            </div>
            <input type="text" placeholder="Search..">
        </div> 
<script>
    function myFunction() {
    document.getElementById("myDropdown").classList.toggle("show");
}
</script>

    </body>

您可以在这里尝试代码：https ://jsfiddle.net/pgn6yw5f/

标签： javascripthtmlcss

在 CSS 文件中设置下拉内容 a 的背景颜色。下面是一个例子

dropdown-content a {
    /* Your other styling */
    background-color: inherit;
}

解决了显示问题。

javascript - 在css中做一个下拉按钮

问题描述

解决方案

推荐阅读