爲什麼這個CSS不適用於Firefox？

-1

我想改變我的輸入類型文件的風格。以下CSS在Chrome和Opera上運行良好，但不在Mozilla Firefox上運行。爲什麼這個CSS不適用於Firefox？

HTML

<input type="file" class="custom-file-input" />

CSS

.custom-file-input::-webkit-file-upload-button { 
    visibility: hidden; 
} 
.custom-file-input::before { 
    content: 'UPLOAD'; 
    display: inline-block; 
    background: -webkit-linear-gradient(top, black, red); 
    border: 1px solid #999; 
    border-radius: 3px; 
    padding: 5px; 
    outline: none; 
    white-space: nowrap; 
    -webkit-user-select: none; 
    cursor: pointer; 
    font-size: 10pt; 
color:#fff; 
} 
.custom-file-input:hover::before { 
    border-color: #fff; 
} 
.custom-file-input:active::before { 
color:#666; 
    background: -webkit-linear-gradient(top, bclack, red); 
}

http://jsfiddle.net/Rameshpardhi/3agapfw3/

我也改變了我的風格是：

.custom-file-input::-moz-file-upload-button { 
    visibility: hidden; 
} 
.custom-file-input::before { 
    content: 'UPLOAD'; 
    display: inline-block; 
    background: -moz-linear-gradient(top, black, red); 
    border: 1px solid #999; 
    border-radius: 3px; 
    padding: 5px; 
    outline: none; 
    white-space: nowrap; 
    -moz-user-select: none; 
    cursor: pointer; 
    font-size: 10pt; 
color:#fff; 
} 
.custom-file-input:hover::before { 
    border-color: #fff; 
} 
.custom-file-input:active::before { 
color:#666; 
    background: -moz-linear-gradient(top, bclack, red); 
}

但它仍然沒有工作。我想知道爲什麼這個CSS不適用於Mozzila？

來源

2015-04-28 Ramesh Pardhi

試圖把-moz-在這樣的酒店前臺：-moz-線性漸變（頂部，bclack，紅色）; – icode03

解釋發生了什麼問題，應該怎麼做 – Vinc199789

可能重複[如何在Firefox中設置文件輸入字段？]（http://stackoverflow.com/questions/352467/how-can-i-style-a- file-input-field-in-firefox） – Flynn1179