elementui修改input样式，仅用于2

1、效果

 

2、代码如下

::v-deep .el-select,

::v-deep .el-input,

::v-deep .el-input__inner{

  border-radius: 20px;

  color:#fff;

  //border: 1px solid green;

  border-radius:0px;

  border-color:#fff;

  text-align: center;

  background-color: transparent;

  border: none;

}

//el-input聚焦的时候 外层的border会有一个样式

::v-deep .el-select .el-input.is-focus .el-input__inner{

  //border:0px;

  border: none;

}

//修改的是el-input上下的小图标的颜色

::v-deep .el-select .el-input .el-select__caret{

  color: #fff;

}

//修改总体选项的样式 最外层

::v-deep .el-select-dropdown{

  //rgba(87,133,87,0.8)

  background: rgba(0, 68, 255, 0.78);

  //margin: 0px;

  border: 1px solid #103d6e;

  //border-radius: 0px;

  //left: 0px !important;

}

//修改单个的选项的样式

::v-deep .el-select-dropdown__item{

  background-color: transparent;

  color:#fff;

}

//item选项的hover样式

::v-deep .el-select-dropdown__item.hover,

::v-deep .el-select-dropdown__item:hover{

  color: rgb(151, 184, 255);

  background: rgba(203, 231, 255, 0.3);

}

//修改的是下拉框选项内容上方的尖角

::v-deep .el-popper .popper__arrow, .el-popper .popper__arrow::after{

  display: none;

}