`
nancychengnan
  • 浏览: 3279 次
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

上传文件file控件美化

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>input file的另类做法</title>
<style type="text/css">
.u-file-btn {
position: relative;
direction:ltr;
height:18px;
overflow:hidden;
line-height:18px;
margin-right:10px;
padding:3px0;
text-align: center;
width:105px;
background:#880000;
color:#FFF;
}

.u-file-btn input{
cursor: pointer;
text-align: right;
z-index:10;
font-size:118px;/* font-size: 118px 工作正常 */       
position: absolute;
top:0px;
right:0px;
opacity:0;
filter:Alpha(opacity:100);
}
</style>
</head>
<body>
<div class="u-file-btn">         <input type="file"name="attach"/>请选择上传文件 </div>
</body>
</html>
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics