单击jquery时的下拉菜单CSS

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

<div class="dropdown">
  <button class="dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
    下拉菜单
  </button>
  <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <li><a class="dropdown-item" href="#">选项1</a></li>
    <li><a class="dropdown-item" href="#">选项2</a></li>
    <li><a class="dropdown-item" href="#">选项3</a></li>
  </ul>
</div>

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-toggle {
  background-color: #f1f1f1;
  color: #333;
  padding: 10px;
  border: none;
  cursor: pointer;
}

.dropdown-menu {
  position: absolute;
  background-color: #fff;
  border: 1px solid #ccc;
  padding: 10px;
  display: none;
}

.dropdown-menu a {
  color: #333;
  text-decoration: none;
  display: block;
  padding: 5px;
}

.dropdown-menu a:hover {
  background-color: #f1f1f1;
}

$(document).ready(function() {
  $('.dropdown-toggle').click(function() {
    $('.dropdown-menu').toggle();
  });
});