element-plus轮播图使用及其样式控制

设置走马灯内容高度只能在.el-carousel__container，直接在.el-carousel-item定义图片高度还是没办法正常显示

<template>
    <div>
    <!-- trriger为el-carousel自带的属性，即触发模式：点击 -->
     <!-- autoplay为el-carousel自带的属性，即自动轮播，默认true为开启 -->
        <el-carousel trigger="click" :autoplay="false">
            <el-carousel-item  v-for="item in urls" :key="item"  >
                <el-image :src="item" fit="cover" ></el-image>
            </el-carousel-item>
        </el-carousel>
    </div>
</template>

<script setup>
import { reactive, ref, shallowRef, onMounted } from 'vue'
import { ElCarousel, ElCarouselItem,ElImage } from 'element-plus'
const urls = [
'https://img.zcool.cn/community/0165135844bedaa801219c77ad4e61.jpg@1280w_1l_2o_100sh.jpg',
'https://img.zcool.cn/community/01a2495a139b8da801205187c20a7c.jpg@1280w_1l_2o_100sh.jpg',
'https://1.s91i.faiusr.com/4/AFsIgKhEEAQYACCd6drhBSjLw5WKBDCADzjYBA!800x800.png?_tm=3&v=1611805440764',
'https://www.25xt.com/uploadfiles/attached/2020/06/12/2020061208474912.jpg', 
]

</script>

<style>
.el-carousel__container{
    height: 600px;
}
.el-image{
    width: 100%;
    height: 100%;
}
</style>