Html 如何仅使用 CSS 设置“选择文件”按钮的样式
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/36540105/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-08-29 13:07:10 来源:igfitidea点击:
How to style a “choose file” button using CSS only
提问by Balvant Ahir
I want to try design this :
我想尝试设计这个：
<input type="file" multiple>
What I want: I want change its color, also change its size...
我想要什么：我想改变它的颜色，也改变它的大小......
回答by Santhosh Kumar
File type is a native element henceforth you cant change it's appearance. Instead you can hide at the back of some element.
文件类型是本机元素，此后您无法更改其外观。相反，您可以隐藏在某个元素的后面。
<div>
Choose File
<input type="file" class="hide_file">
</div>
div{
padding:5px 10px;
background:#00ad2d;
border:1px solid #00ad2d;
position:relative;
color:#fff;
border-radius:2px;
text-align:center;
float:left;
cursor:pointer
}
.hide_file {
position: absolute;
z-index: 1000;
opacity: 0;
cursor: pointer;
right: 0;
top: 0;
height: 100%;
font-size: 24px;
width: 100%;
}
Refer Here
参考这里
回答by Mostafa
You can use sample
您可以使用示例
`https://jsfiddle.net/gabrieleromanato/mxq9R/`
to change style of input files.
更改输入文件的样式。
回答by akhil viswam
input[type='file']{
color:blue;
font-size:25px;
}
