如何访问一个文件的上传按钮的属性？ [英] How to access the properties of a file upload button?

问题描述

您可以告诉我怎么CSS属性分配到按钮的类型=文件，说：

can you show me how to assign css properties to the button that is of type=file,say:

<input type="file"  name="coolFile">

我知道，在CSS你需要做的是：

I know that in css you need to do this:

  input[type=file]{
     background:#ccf;
//and so on
}

我要如何分配值的按钮？

How do I assign values for the button?

推荐答案

不幸的是，主流浏览器不允许设计师直接样式文件输入字段。你可以认为这是一个安全功能，因为用户可能会被欺骗，如果文件输入字段是一个棘手的风格方式上传文件。

Unfortunately, mainstream browsers do not allow designers to directly style file input fields. You can consider this a "security feature" because users could potentially be tricked into uploading files if the file input field is styled in a tricky way.

有是涉及创建第二个输入字段，并隐藏其背后的实际文件输入的解决方案。以下是从 http://www.quirksmode.org/dom/inputfile.html：

There is a solution that involves creating a second input field, and hiding the actual file input behind it. The following was lifted from http://www.quirksmode.org/dom/inputfile.html:

div.fileinputs {
    position: relative;
}

div.fakefile {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
}

input.file {
    position: relative;
    text-align: right;
    -moz-opacity:0 ;
    filter:alpha(opacity: 0);
    opacity: 0;
    z-index: 2;
}

<div class="fileinputs">
    <input type="file" class="file" />
    <div class="fakefile">
    	<input />
    	<img src="search.gif" />
    </div>
</div>

这篇关于如何访问一个文件的上传按钮的属性？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！