自定义input file样式；一般都是通过隐藏input，通过定义label来实现。这种做法要注意的是label的for属性要指定input对应的id;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
#file {
display: none;
}
label {
padding: 6px 15px;
border-radius: 18px;
background: #2F9DEA;
color: #FFF;
border: 1px solid #49A9ED;
box-shadow: inset 0px 0px 3px #FFF;
}
label:focus,
label:active {
box-shadow: none;
}
</style>
</head>
<body>
<div>
<label for="file">
<input type="file" id="file" />上传文件
</label>
</div>
</body>
</html>
效果如下：
点击后效果：
时间： 2024-10-12 22:18:50