如何用純CSS樣式HTML文件實現上傳按鈕

<div class="fileUpload btn btn-primary">
    <span>Upload</span>
    <input type="file" class="upload" />
</div>
.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 10px;
}
.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
}

來源 : How to Style a HTML file upload button in Pure CSS

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末锭部,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌边篮,老刑警劉巖稻扬,帶你破解...
    沈念sama閱讀 212,884評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件茉贡,死亡現場離奇詭異,居然都是意外死亡典尾,警方通過查閱死者的電腦和手機,發(fā)現死者居然都...
    沈念sama閱讀 90,755評論 3 385
  • 文/潘曉璐 我一進店門惩阶,熙熙樓的掌柜王于貴愁眉苦臉地迎上來挎狸,“玉大人,你說我怎么就攤上這事断楷∠谴遥” “怎么了?”我有些...
    開封第一講書人閱讀 158,369評論 0 348
  • 文/不壞的土叔 我叫張陵冬筒,是天一觀的道長恐锣。 經常有香客問我,道長账千,這世上最難降的妖魔是什么侥蒙? 我笑而不...
    開封第一講書人閱讀 56,799評論 1 285
  • 正文 為了忘掉前任,我火速辦了婚禮匀奏,結果婚禮上鞭衩,老公的妹妹穿的比我還像新娘。我一直安慰自己娃善,他們只是感情好论衍,可當我...
    茶點故事閱讀 65,910評論 6 386
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著聚磺,像睡著了一般坯台。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上瘫寝,一...
    開封第一講書人閱讀 50,096評論 1 291
  • 那天蜒蕾,我揣著相機與錄音,去河邊找鬼焕阿。 笑死咪啡,一個胖子當著我的面吹牛,可吹牛的內容都是我干的暮屡。 我是一名探鬼主播撤摸,決...
    沈念sama閱讀 39,159評論 3 411
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼褒纲!你這毒婦竟也來了准夷?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 37,917評論 0 268
  • 序言:老撾萬榮一對情侶失蹤莺掠,失蹤者是張志新(化名)和其女友劉穎衫嵌,沒想到半個月后,有當地人在樹林里發(fā)現了一具尸體彻秆,經...
    沈念sama閱讀 44,360評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡渐扮,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 36,673評論 2 327
  • 正文 我和宋清朗相戀三年论悴,在試婚紗的時候發(fā)現自己被綠了掖棉。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片墓律。...
    茶點故事閱讀 38,814評論 1 341
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖幔亥,靈堂內的尸體忽然破棺而出耻讽,到底是詐尸還是另有隱情,我是刑警寧澤帕棉,帶...
    沈念sama閱讀 34,509評論 4 334
  • 正文 年R本政府宣布针肥,位于F島的核電站,受9級特大地震影響香伴,放射性物質發(fā)生泄漏慰枕。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 40,156評論 3 317
  • 文/蒙蒙 一即纲、第九天 我趴在偏房一處隱蔽的房頂上張望具帮。 院中可真熱鬧,春花似錦低斋、人聲如沸蜂厅。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,882評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽掘猿。三九已至,卻和暖如春唇跨,著一層夾襖步出監(jiān)牢的瞬間稠通,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 32,123評論 1 267
  • 我被黑心中介騙來泰國打工买猖, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留改橘,地道東北人。 一個月前我還...
    沈念sama閱讀 46,641評論 2 362
  • 正文 我出身青樓政勃,卻偏偏與公主長得像唧龄,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子奸远,可洞房花燭夜當晚...
    茶點故事閱讀 43,728評論 2 351

推薦閱讀更多精彩內容

  • afinalAfinal是一個android的ioc既棺,orm框架 https://github.com/yangf...
    passiontim閱讀 15,412評論 2 45
  • 熟悉我了解我的人都知道我不愛打字,我愛寫字懒叛,可能是喜歡筆尖殷實的落在紙上的感覺丸冕,也可能是喜歡許久以后翻開泛黃的紙張...
    Moon小姐閱讀 170評論 0 0
  • 不幸的是,被動的學習有嚴重的缺點薛窥。它讓我們越來越傾向不加鑒別地去吸收那些甚至我們自己也說過與傳聞和謠傳沒有差別...
    Dawn_乾琳閱讀 229評論 0 1
  • 產品胖烛、服務眼姐、體驗或生活方式僅僅有實用價值是遠遠不夠的,只有那些外表美觀佩番、新穎獨特又有情感內涵的產品众旗,才能在帶來經濟...
    榛果Latte閱讀 133評論 0 1
  • 圖片發(fā)自簡書App 一大學朋友和我抱怨贡歧,惱怒不止,說終于體會到了人情冷暖赋秀,問其原因利朵,才知道又是室友之間的是非。有一...
    淺之尤者閱讀 5,138評論 0 1