html5大文件上传技术（五）

最新推荐文章于 2024-06-29 16:04:34 发布

无心2046

最新推荐文章于 2024-06-29 16:04:34 发布

阅读量1.2k

点赞数

文章标签： html5 大文件上传

本文链接：https://blog.csdn.net/u012743824/article/details/79021670

版权

本文是关于HTML5大文件上传技术的第五部分，主要介绍如何进行文件选择，包括拖拽和Input（File）选取方式，并且讲解了如何通过获取文件扩展名来筛选特定类型的文件。

摘要由CSDN通过智能技术生成

六、文件选择

文件选择包括两种，一种是通过html5拖拽、还有就是通过Input（File）选取。

文件选择范例：

<body>
    <style>
    .file_select_example.hovering {
      -webkit-box-shadow: inset 0px 0px 50px #BBB;
      -moz-box-shadow: inset 0px 0px 50px #BBB;
      -o-box-shadow: inset 0px 0px 50px #BBB;
      box-shadow: inset 0px 0px 50px #BBB;
    }
      .file_select_example {
        width: 560px;
        height: 120px;
        border: 1px solid #BBB;
        background: white url("css/img/back_image_1.png");
        position:relative;
        align-content:center;
      text-align: center;
      font-size: 20pt;
      }  
       .word_area {
      border: 2px dashed #BBB;
      text-align: center;
      font-size: 20pt;
      color: #BBB;
      border-radius: 5px;
      float:left;
      position:absolute;
      margin:10px;
      width: 536px;
      height: 96px;
      top:0px;
      left:0px;
      line-height:80