关于前端:layui-cascader-级联框箭头样式修改

63次阅读

共计 441 个字符,预计需要花费 2 分钟才能阅读完成。

cascader 是 layui 第三方的级联抉择框插件,但插件的箭头款式与 layui 的抉择框款式不统一,为了可能界面统一,如何实现?

实现就是重写 class 图标,然而发现 layui 图标并没有向上三角,无奈只能抉择旋转 180 度。。

cascader.css

/* 扭转级联三角款式 */
.layui-icon-down:before {
        content: "\e625";
        color: #c2c2c2;
}
.layui-icon-up:before {
        content: "\e625";
            color: #c2c2c2;
}
.layui-icon-up{
        transition: all 1s;
        -webkit-transition: all 1s;
        transform: rotate(180deg);
        -moz-transition: all 1s;
        -ms-transition: all 1s;
        -o-transition: all 1s;
}

ul.urp-cascader-child>li {padding: 8px 5px;/* 避免第三级变宽 */}

正文完
 0