如何在 CSS 中制作没有图像的自定义选择选项菜单样式？

[我不需要 Unicode 字符]
例如：使用黑色向下三角形。
它将使用-webkit-appearance: none;让它看起来更好。

这很简单：
Select ▼
to
Select ▼
Value1
Value2
或类似的东西

HTML:

<select>
  <option>Value1</option>
  <option>Value2</option>
</select>

问题：如何在没有任何 JavaScript 的情况下用纯 CSS 来实现呢？

选择框并不是真正可以设计样式的，所以如果这是不可能的，我不会感到惊讶。可以使用一些有限的样式选项，但即使它们也是不可靠的。有效设置选择框样式的唯一方法是通过 jQuery，不幸的是，还通过图像。我最喜欢的表单样式插件是这个Uniform- 也许值得一看。

我想出了this纯 HTML，hacky 解决方案，但很糟糕。箭头在鼠标事件到达选择框之前捕获它们。您需要进行一些黑客攻击才能消除这种情况。