No estándar
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.
Resumen
El pseudo-elemento CSS ::-webkit-file-upload-button representa el botón de los elementos <input> con type="file".
No es estándar y es sólo soportado por los navegadores compatibles con WebKit/Blink como Chrome, Opera and Safari (esto queda indicado por el prefijo -webkit ).
Síntaxis
selector::-webkit-file-upload-button
Ejemplo
Contenido HTML
<form>
<label for="fileUpload">Upload file</label><br>
<input type="file" id="fileUpload">
</form>
Contenido CSS
input, label {
display: block;
}
input[type=file]::-webkit-file-upload-button {
border: 1px solid grey;
background: #FFFAAA;
}
Más abajo tienes un ejemplo para probar. El pantallazo a la izquierda muestra como quedaría el botón en caso de que no puedas acceder a Chrome, Opera o Safari.
| Screenshot | Live sample |
|---|---|
 |
Especificaciones
No es parte de ninguna especificación. Es un pseudo-elemento propietario y específico de WebKit/Blink.
Compatibilidad con los distintos navegadores
| Característica | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Soporte básico | Sin soporte | (Yes) | Sin soporte | (Yes) | (Yes) |
| Característica | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Soporte básico | Sin soporte | (Yes) | Sin soporte | (Yes) | (Yes) |