Direkter Link zum Artikel Benutzerdefinierte Datei-Input-Gestaltung

Benutzerdefiniertes Dateieingabe-Styling

Wenn Sie an Webkit/Blink/Chrome-spezifischer Gestaltung interessiert sind, gibt es ein proprietäres Pseudoelement zum Verstecken, und dann die Verwendung eines ebenfalls nicht standardmäßigen Pseudoelements für einen Input

<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 am