html:
1
2
3
4
5
6
7
8
9
10
|
< div class = "form-group" >
< label class = "col-sm-3 col-sm-6 control-label" >图片</ label >
< span class = "problem-must" > </ span >
< div class = "col-sm-8" >
< a class = "fb-upload" href = "javascript:void(0);" >
< input class = "form-control" name = "pic" type = "file" accept = ".gif,.jpg,.png,.jpeg" />
< span class = "fb-img" >上传图片</ span >
</ a >
</ div >
</ div >
|
css:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
.form-group input[type= "file" ] {
cursor : pointer ;
opacity: 0 ;
position : absolute ;
top : 0 ;
} .fb-img { border : 1px solid #ccc ;
border-radius: 4px ;
box-shadow: 0 1px 1px rgba( 0 , 0 , 0 , 0.075 ) inset ;
color : gray ;
display : inline- block ;
height : 34px ;
line-height : 1.42857 ;
padding : 6px 12px ;
text-align : left ;
transition: border-color 0.15 s ease-in-out 0 s, box-shadow 0.15 s ease-in-out 0 s;
width : 100% ;
}
|
本文转自 爱笑嘚蛋蛋 51CTO博客,原文链接:http://blog.51cto.com/dd118/1868944,如需转载请自行联系原作者