React(二)：input原先的样式太难看了，如何更改input的样式

用一个盒子套着input，比如：
 

<div className={styles.CompreFileStyle}>
    点击上传文件
    <input className={styles.inputStyle} id="file" multiple type="file" onChange={this.fileChange} />
</div>

那么我们在更改样式的时候，只要给input加一个透明度为0，然后再子盒子填满父盒子就可，只要更改父盒子的样式，就可以达到我们想要的效果了，比如

.CompreFileStyle {
  display: inline-block;
  background: #D0EEFF;
  border: 1px solid #99D3F5;
  border-radius: 4px;
  padding: 4px 12px;
  overflow: hidden;
  color: #1E88C7;
  text-decoration: none;
  text-indent: 0;
  line-height: 20px;
}
.CompreFileStyle:hover {
  background: #AADFFD;
  border-color: #78C3F3;
  color: #004974;
  text-decoration: none;
}
.inputStyle {
  position: absolute;
  right: 0;
  top: 0;
  opacity: 0;  
}

好了，差不多就是这样了，lucky