首页 > 解决方案 > 如何使所有内容出现在下拉菜单中?

问题描述

我已经给出了 HTML 和 CSS 代码,但是每当我点击下拉菜单时,这些选项就会出现,但它们会隐藏起来,直到我将鼠标悬停在该特定项目上。仅显示悬停的项目。

在此处输入图像描述

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  background: rgba(255, 255, 255, 0.075);
  border-radius: 4px;
  border: none;
  border: solid 1px rgba(255, 255, 255, 0.25);
  color: inherit;
  display: block;
  outline: 0;
  padding: 0 1em;
  text-decoration: none;
  width: 100%;
}
<select name="payment_method" class="select form-control" required="" id="id_payment_method">
  <option value="">-------</option>
  <option value="easypaisa" selected="">EasyPaisa Number</option>
  <option value="jazzcash">Jazzcash Number</option>
</select>

标签: htmlcss

解决方案


尝试这个

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  -ms-appearance: none;
  appearance: none;
  background: rgba(255, 255, 255, 0.075);
  border-radius: 4px;
  border: none;
  border: solid 1px rgba(255, 255, 255, 0.25);
  color: #000;
  display: block;
  outline: 0;
  padding: 0 1em;
  text-decoration: none;
  width: 100%;
}
<select name="payment_method" class="select form-control" required="" id="id_payment_method">
  <option value="">-------</option>
  <option value="easypaisa" selected="">EasyPaisa Number</option>
  <option value="jazzcash">Jazzcash Number</option>
</select>


推荐阅读