在所有浏览器中设置统一<input type ="file"> width

需要什么样的CSS或属性组合？

1> Diodeus - Ja..：

---

隐藏实际控件

使用您想要的控件和样式制作DIV

该按钮不是标准的HTML控件.

请参阅:http://www.quirksmode.org/dom/inputfile.html

---

浏览器不允许将文件输入的点击作为安全功能委派.所以,我们需要黑客的不透明度

2> Ionuț Staicu..：

---

怎么了？

？将看起来相同除了mac上的safari我猜(在Mac上,所有上传控件看起来都不同,在所有浏览器上)

---

W3C无法验证属性`size`,因为它只允许在`text,search,url,tel,e-mail或password`类型的字段上.

3> Bryan M...：

---

除了quirksmode教程,这里还有另一个很好的资源:http: //www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom

如果您隐藏了实际的控件,请记住将控件的不透明度设置为零非常重要,而不是实际使用visibility: hidden.这样做实际上会隐藏元素,禁用点击操作.

此外,如果你用一个图形按钮掩盖控件,请注意在某些浏览器(我认为是Firefox和IE)中,当它在文本上方时,你将无法将光标类型更改为一只手 - 输入文件控件的一部分(它将始终默认为输入或常规非链接指针).是的,我尝试过使用cursor: pointer(和cursor: hand).

就个人而言,我一直在努力使用定制的上传盒,并且没有灵丹妙药可以让它们的外观或定制完美无缺.(特别是关于光标的行为,因为我认为是UI交易破坏者).在一天结束时,我认为更容易接受不同的浏览器将以不同的方式呈现控件,而这就是它的样子.