菜单

采纳透明效果来自定义文件上传按钮控件样式

2019年2月15日 - 金沙前端

File杂谈——初识file控件

2015/07/23 · HTML5 ·
file控件

初稿出处: 金沙手机投注网址,百码山庄   

第壹,自个儿表明下,那里介绍的file控件指的是网页中的FileUpload对象,也等于我们广大的<input type=”file”> 。如若您不是想搜寻那上边的事物,就可以绕道了。

<style>
    .file-group {
澳门金沙总站,        position: relative;
        width: 200px;
        height: 80px;
金沙网投官方网站,        border: 1px solid #ccc; /* 为了显示可见区域,非必须 */
        overflow: hidden;
        cursor: pointer;
        line-height: 80px;
        font-size: 16px;
        text-align: center;
        color: #fff;
        background-color: #f50;
        border-radius: 4px;
    }
    .file-group input {
        position: absolute;
        right: 0;
        top: 0;
        font-size: 300px;
        opacity: 0;
        filter: alpha(opacity=0);
        cursor: pointer;
    }
    .file-group:hover {
        background-color: #f60;
    }
</style>
<div class=”file-group”>
    <input type=”file” name=”” id=”J_File”>
    接纳文件
</div>

upload…

upload…

功能

当大家要求在网页中落成文件上传功效的时候,file控件就足以大显身手了。HTML文档中每添加3个 <input type=”file”> ,实际就是开创了多个FileUpload实例对象。用户可以通过点击file控件选拔当地文件,当大家付出包蕴该file控件的表单时,浏览器会向服务器发送用户选中的本羊眼半夏件。从而将地方文件传输到服务器,供其余互联网用户下载或应用,达成公文上传功用。

上传

上传

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图