Home > Article > Web Front-end > Input File 表单上传按钮美化_html/css_WEB-ITnose
Input File 表单上传按钮美化_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:33:501372browse
HTML
<div class="input-file-button">上传图片<input type="file" class="input-file" hidefocus /></div>CSS
.input-file-button { display:block; width: 200px; height: 80px; text-align: center; line-height: 80px; color: #fff; font-size: 30px; font-family: "MicroSoft YaHei"; text-shadow: 0px 0 5px #A74900; border-radius: 5px; overflow: hidden; position: relative; background: #EC6D0B;}.input-file { height: 80px; font-size: 200px; overflow: hidden; position: absolute; top: 0; right: 0; opacity: 0; filter: alpha(opacity=0); cursor: pointer;} Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：【练习】响应式布局_html/css_WEB-ITnoseNext article：简明CSS属性：定位_html/css_WEB-ITnose