javascript - 文件 uploader 的样式问题

Question

我的文件上传按钮有一个奇怪的样式问题，我似乎无法解决。生成的HTML如下:

<div id="uniform-file_upload" class="uploader">
<input id="file_upload" type="file" multiple="multiple" name="file_upload" size="55" style="opacity: 0;">
<span class="filename" style="-moz-user-select: none;">No file selected</span>
<span class="action" style="-moz-user-select: none;">Choose File</span>
</div>

输出如下:

你能看到“选择文件”字样周围的小方框吗？好吧，它非常丑陋且令人分心，我认为应该很容易摆脱它，但我做不到。

Answer 1

在这种情况下，一个好的调试技巧是使用 Chrome 网络浏览器并尝试使用 Inspect Element 选项。右键单击表单按钮(在您的网页中)并选择“检查元素”(FireFox 有类似的东西，但我更喜欢 Chrome 的)

按钮的样式信息显示在侧面板上，您可以调整样式以获得所需的效果。

注意:在单击“检查元素”后，确认您在“元素”选项卡部分选择了正确的 html 标签。此外，element.style {...} 是侧面板中的一个选项，它允许您编辑所选 html 元素的内联 css。