588创业论坛

 找回密码
 快速注册
搜索
查看: 1072|回复: 0
打印 上一主题 下一主题

input上传按钮美化 input file css样式美化

[复制链接]
匿名
跳转到指定楼层
1
匿名  发表于 2017-7-19 17:58:19 |倒序浏览
在做前端页面 input 文件(图片)上传表单的时候,html自带的type="file"上传表单按钮很不美观,所以就需要通过CSS样式表来美化,具体思路就是先把之前的按钮透明度opacity设置为0,然后,外层用div包裹,实现美化功能。

先放出美化后的效果图:

xx.jpg

通过css+js代码实现点击"+"选择本地上传图片,并在"+"的位置上显示所选图片的缩略图。

前端代码如下:
游客,如果您要查看本帖隐藏内容请回复

您需要登录后才可以回帖 登录 | 快速注册

Archiver|手机版|588创业网 ( 闽ICP备08003622号-6 )

GMT+8, 2024-11-23 07:56 , Processed in 0.122334 second(s), 28 queries .

Powered by bbs.588cy.com

© 2001-2012 Discuz! X2.5

回顶部