发布时间:2024-01-11 15:00
要求定制element-ui选择框Select,需求为增加一根竖线,原始样式为如图,通过打开f12查看样式,做如下调整
修改后效果:
//html
//sass
$px: 1vh;
$hpx: 1vh;
$wpx: 1vw;
* {
margin: 0;
padding: 0;
}
.hello {
height: 88 * $hpx;
width: 96%;
margin: 0 auto;
background-color: silver;
padding: 4 * $px;
//自适应长宽,与背景颜色
.el-input__inner {
height: 6 * $hpx;
width: 14 * $wpx;
background-color: wheat;
}
//新增线条
.el-input__suffix {
border-left: 1px solid white;
}
修改图标样式与自适应大小
.el-select .el-input .el-select__caret {
color: green;
font-size: 1.6 * $px;
}
}