码迷,mamicode.com
首页 > 其他好文 > 详细

elementui carousel不能自适应问题

时间:2020-05-13 12:36:56      阅读:219      评论:0      收藏:0      [点我收藏+]

标签:跑马灯   http   不能   cti   item   z-index   不完全   idt   use   

Vue项目中遇到elemenui  carousel跑马灯图片显示不完全问题,用chrome调试器,发现轮播图中间的width是外层的50%,这样必然会导致图片不自适应。

技术图片

 

 

 

 

 直接简单粗暴重写carousel样式。

    .el-carousel {
      /deep/ .el-carousel__item--card {
        width: auto !important;
      }
      /deep/ .el-carousel__item {
        width: auto !important;
      }
      /deep/ .el-carousel__item--card.is-active {
        z-index: 2;
        position: absolute;
        left: 50%;
        transform: translate(-50%, 0px) !important;
      }
    }

el-carousel给定height为图片高度即可

elementui carousel不能自适应问题

标签:跑马灯   http   不能   cti   item   z-index   不完全   idt   use   

原文地址:https://www.cnblogs.com/qingfengliuyun092815/p/12881255.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!