原
修改element plus Carousel 走马灯 改指示器的样式,变为小圆点的效果。修改切换箭头的样式,位置,颜色等

代码如下:
<!--
修改element plus Carousel 走马灯 改指示器的样式,变为小圆点的效果。
以及切换箭头的颜色加深
-->
<style scoped="scoped" lang="scss">
/*
修改element plus Carousel 走马灯 改指示器的样式,变为小圆点的效果
*/
::v-deep .el-carousel__indicator--horizontal .el-carousel__button {
width: 7px;
height: 7px;
background: #ebe6e6;
border-radius: 50%;
opacity: 1;
}
::v-deep .el-carousel__indicator--horizontal.is-active .el-carousel__button {
width: 7px;
height: 7px;
background: #1880ff;
border-radius: 50%;
opacity: 1;
}
/*
修改element plus Carousel 走马灯 切换箭头样式,位置,颜色等
*/
//调整走马灯箭头-左箭头
::v-deep .el-carousel__arrow--left {
// top: 160px;
// left: -13px;
// 微调一下位置
margin-top: -33px;
font-size: 15px;
opacity: 0.8;
background: #18a6ff;
// color: #02e9ff;
}
//右箭头
::v-deep .el-carousel__arrow--right {
// top: 70px;
// right: -13px;
// 微调一下位置
margin-top: -33px;
font-size: 15px;
opacity: 0.8;
background: #18a6ff;
// color: #02e9ff;
}
</style>
欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739。有需要软件开发,或者学习软件技术的朋友可以和我联系~(Q:815170684)
评价
排名
8
文章
227
粉丝
7
评论
7
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:
50010702506256


欢迎加群交流技术