我正在尝试用自己的图片替换选择箭头。我将SELECT包含在具有相同大小的div中，将选择的背景设置为透明，并且在div的右上角包含了一张图片（与箭头相同的大小）作为背景。它仅适用于Chrome。如何在Firefox和IE9中使它正常运行：.styled-select { width: 100px; height: 17px; overflow: hidden; overflow: -moz-hidden-unscrollable; background: url(images/downarrow_blue.png) no-repeat right white; border: 2px double red; display: inline-block; position: relative;}.styled-select select { background: transparent; -webkit-appearance: none; width: 100px; font-size: 11px; border: 0; height: 17px; position: absolute; left: 0; top: 0;}body { background-color: #333333; color: #FFFFFF;}.block label { color: white;}<HTML><HEAD></HEAD><BODY> <p/> <form action="/prepareUpdateCategoryList.do?forwardto=search"> <fieldset class="block" id="searchBlock"> <p> <label style="width:80px">Class</label> <div class="styled-select"> <select property="voucherCategoryClass"> <option value="0">Select </option> <option value="7382">steam </option> </select> </div> </p> </fieldset> </form></BODY></HTML>
3 回答
拉丁的传说
TA贡献1789条经验 获得超8个赞
您是否尝试过以下方法：
.styled-select select {
-moz-appearance:none; /* Firefox */
-webkit-appearance:none; /* Safari and Chrome */
appearance:none;
}
尚未测试，但应该可以。
编辑：看来Firefox在版本35之前不支持此功能（在此处了解更多信息）
- 3 回答
- 0 关注
- 525 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消