CSS 常见问题

1.input输入框点击有边框的解决办法
点击输入的时候不需要input输入框有边框显示，例如按钮就不需要，如果设置了border-radius，在点击的时候还有边框就会超级丑。如何解决呢？
给input 加一个outline:none; 就ok了
2.input type 为file时移上去的样式
H5的文件选中是非常常用的功能，但是通常来讲，会样式，类似如下

当移上去设置为小手 cursor: pointer;，发现会有问题 ，小手的覆盖会不完全，有点地方仍保持原样式，这是因为原样式虽然隐藏，但是仍占位置，这时加一个 font-size: 0;就可以解决了。
3.修改第三方UI的样式
修改iview,element的样式，可以不加scoped直接修改，但是影响全局不可取，另一种就是在外面套个父盒子改，可以使用 >>> 深入穿透修改样式，但是sass不支持>>>，需要使用/deep/ 来穿透
eg:

.tracts-info-wrappe >>> .el-dialog__footer {
    color: red;
  }
.tracts-info-wrapper /deep/ .el-dialog__footer {
  margin-top: -20px;
}

4.改变滚动条的样式
box滚动的盒子

  .box::-webkit-scrollbar{
    width: 8px;
    height: 5px;
    border-radius: 5px;
    background-color: #EAEAEA;
}
.box::-webkit-scrollbar-thumb{
    min: 5px;
    max: 10px;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 2px rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 0 2px rgba(255, 255, 255, 0.2);
    background: rgba(50, 50, 50, 0.2);
}
 .box::-webkit-scrollbar-track{
    background-color: #EAEAEA;
    border-radius: 5px;
}