如何在不使用自定义图像箭头的情况下自定义html中选择下拉按钮的样式？

Question

.size-box {
    margin-top: -6px;
    width: 91px;
    height: 31px;
    border: 1px solid black;
    padding-left: 10px;
    font-family: 'Metropolis-Medium';
}

<select class="size-box">
    <option >7</option>
    <option >8</option>
    <option >9</option>
    <option >10</option>
</select>

我想要将图片中包围的按钮设置为其样式，其背景将为黑色，并且会更平坦。但是，每当我编辑设计时，它都不会影响选择按钮。你能给我一个如何使用CSS的建议吗？

Answer 1

Here's a great example of how this can be done

你几乎使用：

-webkit-appearance: value;
-moz-appearance:    value;
appearance:         value;

在background-image元素

上创建select