如何在Firefox中设置文件input字段？
我目前正在做一个网站的前端，所有的forms，所有的风格和在IE浏览器漂亮，但我刚刚注意到，在Firefox的文件input字段没有响应任何我的风格，所有其他input字段的types很好。 我已经在Firebug中检查过它，并将正确的样式关联到它，但不改变它的外观。
如果这不是一个完整的脑屁，那么这是Firefox中的一个已知问题吗？ 如果是这样，我怎么从来没有注意到它？
这是一个代码示例。
CSS：
form.CollateralForm input, form.CollateralForm textarea { width:300px; font-size:1em; border: solid 1px #979797; font-family: Verdana, Helvetica, Sans-Serif; } HTML：
<form method="bla" action="blah" class="CollateralForm"> <input type="file" name="descriptionFileUpload" id="descriptionFileUpload" /> </form>
我也尝试应用一个类，但也不起作用。
上面的许多答案都是相当古老的。 在2013年有一个更简单的解决scheme ：几乎所有当前的浏览器…
- 铬
- IE
- 苹果浏览器
- 火狐与几行修复
通过标签的点击事件。 试试这里： http : //jsfiddle.net/rvCBX/7/
- 样式的
<label>但你希望你的file upload。 - 在标签上设置
for="someid"属性 - 创build一个
<input id="someid">元素，这是隐藏的。
点击标签将通过事件传递到Chrome，IE和Safari中的file upload。
Firefox需要一个非常小的解决方法，在这个答案中详细说明 。
Firefox可以使用HTMLinput大小属性：size =“40”，同时使用css宽度来控制布局中字段的全部宽度+button
假设你有你的意见：
<input style="display:none" id="js-choose-file" type="file">
使用jQuery创build一个假button。
<a id="js-choose-computer" href="javascript:void(0);">From Computer</a>
以任何你喜欢的方式来devise上面的button。 然后：
$("#js-choose-computer").on("click", function() { $("#js-choose-file").click(); return false; });
Customformsjs插件在它的File模块类上解决了这个问题。
http://customformsjs.com/doc/File.html
http://customformsjs.com/doc/File.js.html
基本上它有可能types文件input字段的样式有一些限制。 它通过将其包装在一个容器中并使其透明，以便点击它。 演示页面显示它正在运行
使用css类属性的作弊码（＃）说：
form.CollateralForm input, form.CollateralForm textarea { width:300px; //for firefox #width:200px; //for IE7 _width:100px; //for IE6 font-size:1em; border: solid 1px #979797; font-family: Verdana, Helvetica, Sans-Serif; }
