                        课程
                    
                        /前端开发
                        
                            /Bootstrap
                        
                        /玩转Bootstrap（JS插件篇）

如何设置整个轮播插件的高度，以适应开发的需求，仍然满足响应式的布局

要求将整个轮播的区域的高度限定在412px,并且仍然满足按照屏幕缩放的时候，图片仍然可以按比例缩放。

目前重写了 carousel 的样式：

.carousel { height: 412px;margin-bottom:40px;}

.carousel .item {height: 412px;}

但是屏幕缩放的时候，图片宽度会随之改变，但是高度还是412px,导致图片变形

XHK

2015-10-23

源自：玩转Bootstrap（JS插件篇） 5-10

关注问题我要回答

4867

操作

收起

3 回答

慕码人9185764
2018-03-23

单独设置carousel-inner类的最大高度，比如：

.carousel-inner{

max-height: 400px;

}

这样即使图片高度大于400px，只显示400px高度，具体值按照自己需要修改

1 回复有任何疑惑可以回复我~

收起回答

洋葱宝宝
2017-05-11

div上不是有个id么,用@media改那个

0 回复有任何疑惑可以回复我~

收起回答

weibo_比小麻雀还愤怒_0
2015-12-18

修改原图把。

0 回复有任何疑惑可以回复我~

收起回答

0/150

提交

取消

玩转Bootstrap（JS插件篇）

参与学习 128657 人
解答问题 296 个

带领大家学习怎么使用JS自由控制Bootstrap中提供的组件

进入课程

本课相似问答

3 回答图片轮播图片样式（居中大小自适应）

1 回答“设置轮播图片控制器” 的位置

1 回答图片轮播--声明式触轮播图的播放（一）

3 回答请问：如何设置模态框的高度和宽度，经及相对于顶部的距离等。

6 回答如何让轮播图居中

搜索更多本课相关问答

如何设置整个轮播插件的高度，以适应开发的需求，仍然满足响应式的布局

我要回答关注问题

热搜

最近搜索清空

如何设置 整个轮播插件的高度，以适应开发的需求，仍然满足响应式的布局

3 回答

本课相似问答

如何设置 整个轮播插件的高度，以适应开发的需求，仍然满足响应式的布局

如何设置整个轮播插件的高度，以适应开发的需求，仍然满足响应式的布局

如何设置整个轮播插件的高度，以适应开发的需求，仍然满足响应式的布局