html - 更改每个选项旁边的选择下拉箭头

Question

我已将此样式添加到我的所有选择输入的 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;
}

我怎样才能让我的箭头看起来像这些盒子里的箭头？ - http://postimg.org/image/4qvumqoc1/

Answer 1

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: '';
}

这是 fiddle :http://jsfiddle.net/6hMua/