select {
-webkit-appearance: button;
-webkit-border-radius: 2px;
-webkit-box-shadow: 0px 1px 3px rgba(0,0.1);
-webkit-padding-end: 20px;
-webkit-padding-start: 2px;
-webkit-user-select: none;
background-image: url('./select-arrow1.png') ;
background-position: center right;
background-repeat: no-repeat;
border: 1px solid #AAA;
margin: 0;
padding-top: 2px;
padding-bottom: 2px;
width: 200px;
}
其中呈现精美as seen here
根据这个逻辑，我唯一需要做的是使它在Firefox中工作是将所有-webkit- *东西添加为-moz- *：
-moz-appearance: button; -moz-border-radius: 2px; -moz-box-shadow: 0px 1px 3px rgba(0,0.1); -moz-padding-end: 20px; -moz-padding-start: 2px; -moz-user-select: none;
它的工作原理是99％，唯一的问题是，默认下拉箭头不会消失，并保持在背景图像的顶部as seen here
它看起来像-moz-appearance：button;不适用于< select>元件。此外-moz外观：无;没有删除默认下拉箭头的效果。
所以什么是正确的值为-moz外观删除默认下拉箭头？
更新：
2014年12月11日：停止发明新的黑客。 4年半后，-moz-appearance：从Firefox 35开始没有工作。虽然moz-appearance：button仍然坏了，你不需要使用它。 Here is a very basic working example.
2014年4月28日：提到的css hack工作了几个月，但自从2014年4月开始这个bug正在回到Firefox 31.0.a1每晚在所有平台上。
解决方法
等待，看：https://bugzilla.mozilla.org/show_bug.cgi?id=649849
对于那些想知道：
https://bugzilla.mozilla.org/show_bug.cgi?id=649849#c59
First,because the bug has a lot of hostile spam in it,it creates a hostile workplace for anyone who gets assigned to this.
Secondly,the person who has the ability to do this (which includes rewriting ) has been allocated to another project (b2g) for the time being and wont have time until that project get nearer to completion.
Third,even when that person has the time again,there is no guarantee that this will be a priority because,despite webkit having this,it breaks the spec for how is supposed to work (This is what I was told,I do not personally know the spec)
现在看https://wiki.mozilla.org/B2G/Schedule_Roadmap
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。