1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > 弹出 文件 选择 html代码 HTML+CSS点击按钮弹出文件选择框的最佳方案

弹出 文件 选择 html代码 HTML+CSS点击按钮弹出文件选择框的最佳方案

时间:2018-10-08 21:56:55

相关推荐

弹出 文件 选择 html代码 HTML+CSS点击按钮弹出文件选择框的最佳方案

网页设计中,对于文件选择框(HTML的file标签),出于美观或者体验等等的原因,我们对他的默认外观并不满意,我们可能希望点击一个按钮直接弹出文件选择框,这个很多人认为很简单,但是由于浏览器兼容的原因,主要是在IE8中,不允许调用隐藏file标签的click方法,这个并不容易实现。

很多人会考虑使用flash控件或者ActiveX控件,这个方法功能上没问题,但是对客户机的环境有依赖,并不完美。

经过仔细研究和试验,找到了一个看上去比较完美的设计方案,基本上不存在浏览器兼容问题。基本设计思路就是,用一个定宽定高、不能滚动、透明的DIV,包裹一个非常大的file标签,file标签的font-size具体数值可以灵活设定,主要是保证DIV的可见范围内的下面,完全是file标签的浏览按钮即可,剩下的外观就是开发者自由发挥了,最后只要保证定宽定高的DIV和用户可见的点击区域的外观完全吻合即可。

下面上样例代码:

上传资料

如果将上述代码片断直接拷贝运行,可能有问题,因为已经把我们的实际样式去掉了,只剩下了精华,理解了设计思路的开发者,考验你CSS水平的时候到了。

原文:/liyuj/blog/391905

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。