Diskussion über Stilanpassung und Browserkompatibilitätsprobleme bei der Verwendung des Eingabeelements [type="file"]

<Eingabetyp="Datei" />

<div id="Eingabedatei">
<span id="text">Zum Hochladen klicken</span>
<input id="Datei" Typ="Datei" />
</div>

#Eingabedatei {
position: relative; /* Positionierung der untergeordneten Elemente sicherstellen*/
Breite: 120px;
Höhe: 30px;
Hintergrund: #eee;
Rand: 1px durchgezogen #ccc;
Textausrichtung: zentriert;
Cursor: Zeiger;
}
#text {
Anzeige: Inline-Block;
Rand oben: 5px;
Farbe: #666;
Schriftfamilie: „黑体“;
Schriftgröße: 18px;
}
#Datei {
Anzeige: Block;
Position: absolut;
oben: 0;
links: 0;
Breite: 120px; /* Die Breite und Höhe sollten mit den umgebenden Elementen übereinstimmen*/
Höhe: 30px;
Deckkraft: 0;
-moz-opacity: 0; /* Kompatibel mit älteren Browsern */
Filter: Alpha (Deckkraft = 0); /* IE-kompatibel */
}