编程语言
首页 > 编程语言> > javascript-如何将下拉列表中的三角形图标更改为html中的自定义图标

javascript-如何将下拉列表中的三角形图标更改为html中的自定义图标

作者:互联网

我正在尝试创建一些下拉列表,但我需要一个自定义的图标,而不是老式的黑色三角形.我尝试了一些来自网络的技巧,但不符合我的建议.

我相信可以使用JavaScript或j查询,但是我不知道.
怎么做 ??

解决方法:

你可以这样

勾选这个demo jsFiddle

的CSS

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    text-indent: 1px;
    text-overflow: '';
    background: url("YOUR IMAGE") no-repeat right center;
}

select::-ms-expand {
    display: none;
}

的HTML

<div class="dropdown">
     <p>Show: </p>

     <select>
          <option> Balloon</option>
          <option> Mango</option>
          <option> Banana</option>
     </select>
</div> 

标签:drop-down-menu,html,javascript,jquery
来源: https://codeday.me/bug/20191121/2055400.html