织梦css修改幻灯片尺寸

<div class="slider">
    <div class="slide">
        <img src="image1.jpg" alt="Image 1">
    </div>
    <div class="slide">
        <img src="image2.jpg" alt="Image 2">
    </div>
</div>

/* 固定尺寸 */
.slider .slide img {
    width: 800px;
    height: 400px;
}

/* 相对尺寸 */
.slider .slide img {
    width: 100%;
    height: auto;
}

/* 自适应尺寸 */
@media (max-width: 768px) {
    .slider .slide img {
        width: 100%;
        height: 300px;
    }
}

.slider .slide img {
    width: 100%;
    height: auto;
    object-fit: cover; /* 保持图片比例并裁剪多余部分 */
}

@media (max-width: 768px) {
    .slider .slide img {
        width: 100%;
        height: 300px;
    }
}