elementUi 走马灯的el-carousel不设置高度 怎么让图片自适应 只设置宽度 不设置高度

可以通过设置图片的 max-height 属性来让图片自适应高度，例如：

<el-carousel>
  <el-carousel-item v-for="(item, index) in list" :key="index">
    <img :src="item.imgUrl" style="width: 100%; max-height: 100%;">
  </el-carousel-item>
</el-carousel>

这样就可以让图片根据宽度自适应高度。

相关问题

elementUi 走马灯的el-carousel不想设置高度 怎么让图片自适应 只设置宽度 不设置高度

你可以将图片的高度设置为 auto 或 100%。这将使图片自适应其容器的高度。例如：

<el-carousel height="300px">
  <el-carousel-item>
    <img src="your-image-url" style="width:100%;height:auto;">
  </el-carousel-item>
</el-carousel>

或者：

<el-carousel height="300px">
  <el-carousel-item>
    <img src="your-image-url" style="width:100%;height:100%;">
  </el-carousel-item>
</el-carousel>

这两种方法都会将图片适应其容器的高度，而不需要对其进行高度的显式设置。

element-ui走马灯如何实现图片自适应 长度和高度 自适应屏幕大小

element-ui的走马灯组件默认情况下是不支持图片自适应的，需要通过设置样式来实现。具体步骤如下：

1. 在走马灯组件中设置图片的样式为宽度和高度都为100%。

2. 在CSS中设置走马灯组件的高度为100%。

这样就可以实现图片自适应屏幕大小的效果了。具体代码如下：

<el-carousel :height="carouselHeight">
  <el-carousel-item v-for="(item, index) in items" :key="index">
    <img :src="item.src" class="carousel-image">
  </el-carousel-item>
</el-carousel>

.carousel-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.el-carousel {
  height: 100%;
}

其中，`carouselHeight` 是走马灯组件的高度，可以根据需要进行设置。`object-fit: cover` 表示图片按比例缩放，填充整个容器，保持宽高比不变。