html - 设置制服所有浏览器的宽度

Question

需要什么 CSS 或属性组合？

Answer 1

• 隐藏实际控制
• 使用您想要的控件和样式制作了一个 DIV

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

见：http ://www.quirksmode.org/dom/inputfile.html

Answer 2

怎么了

<input type="file" size="50" .... />

? 我猜除了 mac 上的 safari 之外看起来都一样（在 mac 上，所有上传控件在所有浏览器上看起来都不同）

Answer 3

除了 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 交易破坏者）。归根结底，我认为更容易接受不同的浏览器会以不同的方式呈现控件，事实就是如此。