请使用firefox,chrome等最新浏览器浏览本站。

组件美化- input file

css3 阿豹 529次浏览 0个评论 扫描二维码

index.html

<a href="javascript:" class="u-filebtn">选择系统头像 <input type="file" name="" value="" placeholder=""></a>

sass

.u-filebtn {
   width: 100px;
   height: 30px;
   position: relative;
   background: #ff9a00;
   border: 1px solid #e76600;
   line-height: 30px;
   text-align: center;
   color: #ffffff;
   font-size: 12px;
   display: inline-block;
   text-decoration: none;
   input {
       width: 100% !important;
       height: 100% !important;
       position: absolute;
       left: 0;
       top: 0;
       right: 0;
       bottom: 0;
       opacity: 0;
       -moz-opacity: 0;
       filter: alpha(opacity=0);
       cursor: pointer;
   }
}

转载请注明组件美化- input file
喜欢 (9)or分享 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到