背景颜色和边框[暂停]

问题描述 投票:-1回答:3

我正在尝试更改整个选择元素的背景颜色。我已经在select元素和选项上尝试了背景色。它适用于该选项,但在选择列表的顶部和底部有一些灰色边框。我如何删除这个并使方框?

    .option {
       background-color: red;
       border: 0;
       outline: 0
    }
<select class="list">
        <option class="option">
    </select>

我正在测试IE和FF,因为Chrome有它的原生下拉列表

css
3个回答
0
投票

你可以尝试这样的事情:

.option {
  color: #ffffff;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  cursor: pointer;
  user-select: none;
}

希望它会有所帮助。 :)


0
投票

这是不可能的,因为这个元素与其他元素不同,它取决于你使用的操作系统版本而不是浏览器。但是有插件/库可以帮助你


0
投票

您正在将css设置为输入选项,尝试将css设置为选择控件。像这样:

    .option {
       background-color: red;
       border: 0;
       outline: 0
    }
<select class="option">
        <option>Option 1</option>
    </select>