调整文件上传按钮的大小

Question

我想调整HTML中文件上传按钮中显示的“浏览”部分的大小。当我尝试使用“大小”或“宽度”属性调整大小时，只减小整个大小。但我只希望减少“浏览”按钮部分的大小，而不是显示文件路径的文本框部分。我可以不使用CSS吗？如果是，怎么样？

Answer 1

众所周知，文件输入元素很难设计。其中一个问题是，它实际上是一个单独的元素，即使它呈现为两个元素。

一种方法是隐藏幕后的整个元素，并向用户显示自定义元素。这是关于它的an article。基本上，文件输入元素是隐藏的，一些JavaScript支持的一些自定义元素正在处理UI并将必要的信息传递给文件输入。

Answer 2

很难更改“浏览”按钮的外观，因为它通常是硬连线到浏览器中。

但是，在Quirksmode.org|Styling an input type="file"，有一篇很长的文章讨论了用于更改文件输入元素外观的复杂CSS技术。