Javascript 样式与CSS选择箭头

我如何设置选择框的样式，如下所示：

主要的问题是，我的箭头-是透明的背景，但我需要灰色背景选择与选择功能

我是这样做的：

.modal.custom .modal-body.full-width .styled-select{
    width: 440px;
    -webkit-appearance: none;
}

.modal.custom .modal-body.full-width .styled-select select{
  width: 480px;
  overflow: hidden;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: url(../images/png/v.png) no-repeat center right #eeeeee;
}

但似乎有些不好

看起来是这样的：

还有小提琴的例子：

---

是否真的要像第一张图像一样，这样它就可以被点击？

您只需要使用如下百分比指定背景的位置

css:

这意味着后圆的位置是盒子宽度的99%，所以它不会粘在边缘上，也不会粘在盒子高度的50%，所以它总是垂直居中

下面是一个JSFIDLE演示：

---

希望这有帮助

还有什么？背景仍为灰色，但必须仅在右侧为灰色如果只想更改箭头的背景，则必须使用灰色背景的箭头图像，并将背景css末尾的EEEE替换为ffffff：

background: url(https://dl.dropboxusercontent.com/u/59666091/v.png) no-repeat 99% 50% #eeeeee;