默认文件上传样式如下：
<form name="ufm" id="ufm" method="post" action="" enctype="multipart/form-data">
<input type="file" name="file" class="file_input" />
<input type="button" value="上传" class="fileupload" id = "supfm" />
</form>
如下图：
fileupload.png
这个样式真的很难看， 不仅占用面积，还很难看，经过改造变为这样如下这样：
upload_style.png
当用户点击上传按钮的时候弹出文件选择框，然后直接上传文件。
上面使用的样式如下：
html source:
<td align="right">上传图片</td><td style="position:relative;">
<input type="text" value="" name="rico" id="rico" class="menu_text" />
<input type="file" name="file" class="file_input" onchange="uploadFile();" />
<input type="button" value="上传" class="fileupload" id = "supfm" /></td>
css:
.fileupload {background-color:#FFF; border:1px solid #CDCDCD;height:32px; width:70px;}
.file_input{ position:absolute; left:370px; top:12px; height:24px;width:260px; z-index: 1; filter:alpha(opacity:0);opacity: 0;}
这样就好看多了，其他前端特殊展示功能可以在函数uploadFile() 中随便调节.
上面实现的方法是： 将file input和上传按钮重叠，且变透明，且在上传按钮之上， 从css中也可以看出来，这样需要我们自动调用上传服务器操作，因为真正的上传按钮已经点不上了. 也可以在选择文件之后切换回来，将上传按钮显示出来。这样用户再点击就是真正的上传了. 这都是可以灵活调节的.
