Moo*_*oon 11 javascript css webforms input
可能重复:设置
输入类型="文件"按钮的样式
我想要风格
<input type="file">
但我运气不好.我想让文本框消失,只保留按钮.我该怎么做？
小智 20
CSS方式(基本代码在这里找到):
<html>
<style type="text/css">
div.fileinputs {
position: relative;
}
div.fakefile {
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
}
div.fakefile input[type=button] {
/* enough width to completely overlap the real hidden file control */
cursor: pointer;
width: 148px;
}
div.fileinputs input.file {
position: relative;
text-align: right;
-moz-opacity:0 ;
filter:alpha(opacity: 0);
opacity: 0;
z-index: 2;
}
</style>
<div class="fileinputs">
<input type="file" class="file" />
<div class="fakefile">
<input type="button" value="Select file" />
</div>
</div>
</html>
Sar*_*raz 12
没有简单的跨浏览器方式来设置输入类型的文件的样式.因此存在甚至使用javascript的解决方案.
这是一个jQuery插件,您可以使用它以跨浏览器方式设置文件类型的样式:
浏览器不允许您设置文件输入样式.文件样式插件修复了这个问题.它使您可以使用图像作为浏览按钮.您还可以使用css将文件名字段设置为普通文本字段.它是使用JavaScript和jQuery编写的.
也发布在流行的ajaxian.com上,你也可以看看这个:
Shaun Inman有一个可爱的小黑客,允许你使用CSS和DOM设置文件输入的样式.
这些元素是非常痛苦的处理,现在我们选择盒装在IE上玩得很好,我们需要别的东西来解决:)