更改文件浏览按钮的样式

Question

  

可能重复：
  What is the best way to replace the file browse button in html?
  How to style “input file” with CSS3 / Javascript?

可以改变<input type='file' />的风格吗？

如果是，如何改变？ chrome显示我在文件浏览输入中选择的文件名。

如何在文件浏览输入中隐藏文件名？

Answer 1

之前被问到：

• How can I style a file input field in Firefox?
• Styling an input type="file" button
• How to style "input file" with CSS3 / Javascript?
• Styling <input type="file">
• Change cursor type on input type="file"
• https://stackoverflow.com/questions/3984815/jquery-best-way-to-style-a-input-file-tag
• how can i style input file textbox?

如果你已经搜索过它，它会从StackOverflow本身给你最好的答案。 希望它能奏效！

Answer 2

不，它无法改变。

然而，网络上广为流传的伎俩。我们的想法是为<input type="file"/>提供不透明度值0.1并将其放置在图像上方。出于所有实际目的，它将是不可见的，只有图片可见，但它会收到鼠标点击。使用一些Javascript，您可以在页面的其他位置显示所选的文件名。

Answer 3

你可以使用几行javascript。以下是示例演示http://jsfiddle.net/eyjsF/