3. input的file样式的美化
2019-07-02 本文已影响0人
chan_it
- label + display:none
<style>
#file1{
display: none;
}
</style>
<body>
<label><input type="file" name="" id="file1">请选择文件</label>
</body>
- 定位 + opacity
<style>
.file{
position: relative;
}
input{
position: absolute;
top: 0;
left: 0;
opacity: 0;
}
.file-label{
color: #999;
}
.file:hover .file-label{
color: #09f;
}
</style>
<body>
<div class="file">
<div class="file-label">请选择文件</div>
<input type="file" name="" id="file1">
</div>
</body>