自定义文件输入样式的文章的直接链接

自定义文件输入样式

如果你对 Webkit/Blink/Chrome 特定的样式感兴趣,有一个专有的伪元素可以隐藏,然后使用一个同样非标准的输入上的伪元素

<input class="custom-file-input" type="file"
.custom-file-input::-webkit-file-upload-button {
  visibility: hidden;
}
.custom-file-input::before {
  content: 'Select some files';
  display: inline-block;
  background: linear-gradient(top, 
Avatar of Chris Coyier
Chris Coyier