html - 删除我在网上找到的这个轮播下方的大空白?
问题描述
所以我在我的网站(aceitesmaverick.com)上实现了这个轮播(https://bootsnipp.com/snippets/Q0Z1j)
轮播和页脚之间有很大的空间,我该如何删除它?
有人可以向我指出我需要改变什么,所以我下面没有那么大的空白吗?
我真的很感激任何帮助 css 如下:
text-align:center;
padding: 20px;
}
/* Slider */
.slick-slide {
margin: 0px 20px;
}
.slick-slide img {
width: 100%;
}
.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track
{
position: relative;
top: 0;
left: 0;
display: block;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
解决方案
您需要在幻灯片类上设置高度。
.slide {
height: 200px;
}
推荐阅读
- python - 如何使用 WhatsApp 等二维码进行自动登录?
- scala - 从 HDFS 文件夹流式传输
- javascript - 如何上传与文档相关的音频?
- windows - 对于“WMIC 已弃用”,我该怎么办?
- vue.js - 为什么即使没有参数也可以在 Vue v-on 方法中访问“事件”?
- postgresql - 我可以通过 pgadmin 连接到我的数据库,但我无法使用终端(psql)连接到数据库
- android - 如何在安卓应用中正确使用weatherbit.io api
- plugins - 如果图像名称有 / 斜线,则处理 Kubernetes 插件抛出错误的 YAML 文件步骤
- javascript - 在容器外单击时容器自动隐藏
- c++ - 如何使用“->”运算符更改单链表中的指针地址