Sto cercando di creare un campo per il caricamento di file che abbia un po 'di stile, ma sembra che abbia problemi a trovare degli esempi. So parte del motivo è che il campo stesso varia da browser a browser.Stile campo caricamento file HTML
Qualche idea su come procedere? O c'è un modo per farlo senza usare un elemento file di un modulo che può essere disegnato?
Se quello che vuoi dire è il campo di testo per i nomi dei file, è possibile utilizzare l'input [type = file] selettore nei file CSS. Per esempio:
input[type=file] { background-color: red; }
Se quello che vuoi dire è la finestra di dialogo di selezione dei file, penso che sia il browser/OS dipendente e c'è poco (se presente) si può fare al riguardo.
Ecco alcuni link che ho trovato:
One Extra Pixel Article (look for the file input styling section)
sono venuto su questo problema prima. Sfortunatamente, i caricamenti di file sono quasi impossibili da applicare in modo coerente nei vari browser. A partire dal CSS 2, penso, lo standard W3C lascia specificatamente un comportamento indefinito - pensa a quanti modi avrebbe bisogno di essere implementato su piattaforme diverse. Firefox, ad esempio, genera pulsanti anonimi e elementi di input all'interno dell'elemento di caricamento file che ereditano solo alcune delle proprietà impostate sull'elemento di caricamento stesso.
È possibile ottenere un po 'di lavoro utilizzando, ad esempio, il metodo di Furuno, ma sapere che il comportamento sarà imprevedibile e differire ampiamente tra piattaforme/browser.
This si adatta alle vostre esigenze.
Se si utilizza jQuery, uno sguardo a questo plugin - https://github.com/ajaxray/bootstrap-file-field
Questo piccolo plug-in per visualizzare il campo di input file come un pulsante di bootstrap (con le classi configurabili) e mostrerà i nomi dei file selezionati (o errori di selezione) magnificamente.
Inoltre, è possibile impostare varie restrizioni utilizzando semplici attributi di dati o impostazioni JS.
e, g, data-file-types="image/jpeg,image/png" limiterà la selezione dei tipi di file eccetto le immagini jpg e png.