html文件选择框美化,input file 文件选择框美化

测试上传文件

* {font-size:12px;margin:0;}

body {background:#fff;}

form {margin:12px;}

input.file{

vertical-align:middle;

position:relative;

left:-218px;

filter:alpha(opacity=0);

opacity:0;

z-index:1;

*width:223px;

}

form input.viewfile {

z-index:99;

border:1px solid #ccc;

padding:2px;

width:150px;

vertical-align:middle;

color:#999;

}

form p span {

float:left;

}

form label.bottom {

border:1px solid #38597a;

background:#4e7ba9;

color:#fff;

height:19px;

line-height:19px;

display:block;

width:60px;

text-align:center;

cursor:pointer;

float:left;

position:relative;

*top:1px;

}

form input.submit {

border:0;

background:#380;

width:70px;

height:22px;

line-height:22px;

color:#fff;

cursor:pointer;

}

p.clear {

clear:left;

margin-top:12px;

}

上传文件：

查找文件