如何使禁用的 select 框看起来像普通文本框（仅限 css）

Question

我尝试更改 select 框的内联 css，如下所示

.chosen-disabled .chosen-single {
  cursor: default;
  color: #000;
  border: 1px solid #444; 
}

select 框似乎已褪色，但我需要它看起来像一个普通的文本字段（但仍处于禁用状态）。

请在这里帮助我并提前致谢。

Answer 1

我不是 100% 确定这是否是您正在寻找的，但它似乎基于您所说的您想要的（应用禁用时文本为红色）

CSS:

select {
  cursor: default;
  color: #000;
  border: 3px solid #444; 
}

select.disabled {
    color:red;
}

HTML:

<select disabled class="disabled">
    <option>1</option>
    <option>2</option>
    <option>3</option>
</select>

Answer 2

您可以使用禁用的 CSS 选择器。

input[type="text"]:disabled {
    background: #dddddd;
}

Answer 3

感谢@Christoph 和@Carine，我通过将内联 css 设为

来覆盖选择的禁用 class

.chosen-disabled {
    opacity: 1 !important;
}

现在可以正常使用了，再次感谢您的支持。

How to make a disabled select box look like a normal text box(css only)