![](https://img-blog.csdnimg.cn/0f34ef12275c44318aa3af431b0cfb16.png)
今天遇到一个换图标的,找了好多人的博客都没清晰的解决我的问题,还是自己写一个吧
第一步,先把右边的箭头给隐藏了 这个需要用到穿透 下面是css代码
>>>.el-collapse-item__arrow{
display: none;
}
//下方两个是打开和关闭的图标
.downArrow1{
display: inline-block;
width: 13px;
height: 16px;
background-image: url(~@/assets/images/downArrow1.png);
}
.downArrow2{
display: inline-block;
width: 13px;
height: 16px;
background-image: url(~@/assets/images/downArrow1.png);
transform: rotate(-180deg);
}
//头部穿透,让头部内容在两端,本身固有属性是flex
>>> .el-collapse-item__header {
justify-content: space-between;
}
然后试用具名插槽把头部内容替换掉
第一部分 单选题 |