2/14 修改 input 上传文件的css（ label 标签的运用）

写在前面

　　以前第一次想修改input的时候，用的是覆盖方法就是通过定位来将inpu 置于设置了的盒子的上面

　　然后设置 input 的透明度为 0

　　这个样子后也能对使用者来说，感觉一样的，但是作为写代码的总觉得哪里憋得慌

　　个人感觉好像堵在那了不美观

　　直到我知道 label 标签（ css 基础不扎实）

初步认识 label

　　首先这里有个 form

　　在浏览器里面可以看到是这个样子的

　　一一对应

　　这个时候我们注意一下，每个 input 的 id

　　然后写一堆 label 注意 label 的 for

 1  <form class="form">
 2             <input type="text" name="title" id="title" placeholder="请输入标题">
 3             <input type="checkbox" name="checkbox" id="checkbox">
 4             <input type="file" name="picture" id="picture" accept="image/png,image/gif,image/jpeg">
 5             <input type="submit" name="submit" id="submit">
 6 
 7             <label for="title">点击我输入( 然而没有什么用 )</label>
 8             <br>
 9             <label for="checkbox">点击我选择</label>
10             <br>
11             <label for="picture">点击我上传图片</label>
12             <br>
13             <label for="submit">点击我提交</label>
14 
15         </form>