IDC资讯中心
如何修改file表单的样式？客户给定一个样式，要求我将file表单的样式改成他提供的那种样式—-前面是一个蓝色的边框的文本框，后面的浏览按纽改成一个给定的图片。
看到这个功能，第一个想法就是模拟，使用文本框加图片模拟file表单，因为file表单后面的按纽上的文字（浏览…）和图片是不可改的，也不可以使用css设置的。
<!–
************************************
功能：模拟file表单，设置其样式
来源：网络
整理与修改：www.aspprogram.cn
************************************
–>
<style>
input{border:1px solid #333333;color:#666666;background:#eeeeee;font:normal 12px Tahoma;height:18px}
</style>
<form method=”post” action=”11.asp” enctype=”multipart/form-data”>
<input id=”f_file” style=”border:1px solid #0000ff;”> <input type=”button” onmouseover=”fclick(t_file)” value=”” style=”background-image:url(‘fasong.jpg’); width:60px; height:19px;”>
<input name=”upload” type=”file” style=”position:absolute;filter:alpha(opacity=0);width:30px;” id=”t_file” onchange=”f_file.value=this.value” hidefocus>
<br><input type=”submit” value=”提交”>
</form>
<script>
function fclick(obj){
with(obj){
style.posTop=event.srcElement.offsetTop;
var x=event.x-offsetWidth/2;
if(x<event.srcElement.offsetLeft)x=event.srcElement.offsetLeft;
if(x>event.srcElement.offsetLeft+event.srcElement.offsetWidth-offsetWidth)x=event.srcElement.offsetLeft+event.srcElement.offsetWidth-offsetWidth;
style.posLeft=x;
}
}
</script>
