html - 猫头鹰轮播中不需要的右边距
问题描述
我正在尝试在页面的标题部分制作全高和全宽滑块。为此,我正在使用 owl carousel 和 bootstrap。一切正常,但我得到了一些我不想要的正确边距。我确实重置了页面的边距和填充,但是当我使用 owl carousel 时,我得到了正确的边距。请帮助我如何摆脱这个保证金。
这是代码。
HTML
<div class="header">
<div class="container-fluid">
<div class="row owl-carousel">
<div class="item d-flex flex-row">
<div class="left">hello</div>
<div class="right">world</div>
</div>
<div class="item d-flex flex-row">
<div class="left one">hello</div>
<div class="right two">world</div>
</div>
</div>
</div>
</div>
CSS
*{
padding: 0;
margin: 0;
box-sizing: border-box;
}
body{
font-family: 'Roboto', sans-serif;
}
.left{
height:100vh;
width:30%;
background-color: red;
}
.right{
height:100vh;
width:70%;
background-color: green;
}
.one{
background-color: yellow;
}
.two{
background-color: orange;
}
JS
$('.owl-carousel').owlCarousel({
loop:true,
nav:false,
autoplay:true,
autoplayTimeout:4000,
items:1
});
解决方案
在js中添加边距值。
margin:0,
推荐阅读
- python - 如何测量在循环中创建的多线程所花费的时间?
- javascript - 如何使用正则表达式解析 svg `viewBox` 属性?
- python - django-rest-auth "此电子邮件地址的用户配置文件已存在。" 在登录
- html - CSS边框底部和悬停背景
- react-native - 将 OneSignal 更新到最新版本后,RNOneSignal.configure 不再是一个函数
- python - 使用多处理为多个文件指定唯一名称
- javascript - 脚本只执行一次
- typescript - 无法使用 Lighthouse Typescript 定义
- python - 无法使用 screener.in 的 urllib 获取 sessionid
- java - 向 Cloudant 发送 HTTP PUT 请求