Html 更改每个选项旁边的“选择”下拉箭头

我已将此样式添加到所有select输入的css文件中

select {
    border:1px solid #666666;;
    width:100%;
    height:26px;
    font-size:12px;
    margin:0 0 20px 0;
    padding-left:10px;
    float:right;
    -webkit-appearance:none;
    background-image:url('../../images/dropdown.png');
    background-size:25px;
    background-position:98% 50%;
    background-repeat:no-repeat;
    border-radius:0;
}

如何使我的箭头看起来像这些框中的箭头

---

这里有一个问题：

检查该链接的可能副本，并在那里查看正确答案，也可以帮助您解决问题。我希望能够将其添加到我的CSS中，而不是HTMLis中。无论如何，我可以使用HTML代码而不是背景图像？

select {
    border:1px solid #666666;;
    width:100%;
    height:26px;
    font-size:12px;
    margin:0 0 20px 0;
    padding-left:10px;
    float:right;
    -webkit-appearance:none;
    background-image:url('../../images/dropdown.png');
    background-size:25px;
    background-position:98% 50%;
    background-repeat:no-repeat;
    border-radius:0;
    -moz-appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
}