懸停下拉菜單

Question

我還在學習編程。 我的問題是如何在懸停時顯示下拉菜單？ 我有這個 html 代碼：

<nav class="nav nav-pills nav-fill">
        <a class="nav-item nav-link active" href="#">Начало</a>
        <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown"
                aria-haspopup="true" aria-expanded="false">
                Мъжки дрехи</a>
            <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                <a class="dropdown-item" href="#">Тениски</a>
                <a class="dropdown-item" href="#">Ризи</a>
                <a class="dropdown-item" href="#">Дънки</a>
                <a class="dropdown-item" href="#">Блузи</a>
                <a class="dropdown-item" href="#">Официални облекла</a>

            </div>
        </li>

Answer 1

如果您只想使用 CSS，那么您可以使用如下列表項來完成，您需要添加更多 CSS 以使其按照您想要的方式進行布局：

    <ul class="menu">
      <li><a href='somelink'>Parent menu item</a></li>
      <li><a href='somelink'>Parent menu item with sub menu</a>
         <ul>
           <li><a href='somelink'>Sub item 1</a></li>
           <li><a href='somelink'>Sub item 2</a></li>
         </ul>
    </li>

<style>
    .menu li ul {
      display:none;
    }

    .menu li:hover ul {
      display:block;
    }

</style>

以下示例為您提供了更多詳細信息，包括一些額外的 CSS 以使其看起來不錯： https : //codepen.io/andornagy/pen/xhiJH