我在我的网站上使用的是最新版本的Bootstrap。每次旋转木马滑动时,幻灯片图像下方都会出现一个白色背景。
这是从哪里来的,我如何摆脱它?图像的大小各不相同。
发布于 2016-03-20 12:17:52
可能是旋转木马的默认背景颜色,也可能是.To下面的某个东西找到它的原点,尝试覆盖旋转木马或正文或html的背景颜色,或者可能是它下面的容器使用不同的背景颜色。
为了避免将图像的高度更改为
height:100% ; or height:"100vh";如果上面的方法不起作用,还可以为
/body元素
设置高度
发布于 2016-03-20 12:40:26
您需要将图像的高度设置为100%,以便它覆盖旋转木马容器的整个高度。要做到这一点,你必须将所有图像的父容器设置为100%,你还必须给你的.carousel一个特定的高度。因此,您必须将.carousel设置为类似于height: 500px的值,然后将.carousel-inner、.item和.item img都设置为height: 100%;。如果你想保持图像的分辨率,那么你可以去掉图像标签,给每张幻灯片另一个类,例如。.slide-one、.slide-two、.slide-three等。然后,您可以为这些类中的每个类提供一个背景图像,并将其设置为cover,但您仍然需要将carousel高度设置为某个高度,然后将.carousel-inner和.item设置为height: 100%。这是一个示例小提琴,我向人们展示如何使他们的旋转木马真正具有响应性。它对.carousel-item使用填充底部,然后您将其设置为百分比。然后弄乱这个填充底部的百分比,以获得您想要的高度。然后将每个项目设置为具有背景图像。下面是您可能想要查看的小提琴
但是要让您的旋转木马工作,您需要像我前面提到的那样,将图像和它的parents containers高度设置为100%。如果你不想弄乱其中任何一个,你可以调整你的图片大小,使其与许多网页图片大小一致,你可以只需谷歌调整图片大小就可以找到一个。
希望这一切都能有所帮助
https://stackoverflow.com/questions/36110121
复制相似问题