gpt4 book ai didi

html - 如何在低于 767px 宽度时从 DIV 中删除左边距

转载 作者:太空宇宙 更新时间:2023-11-04 11:15:42 25 4
gpt4 key购买 nike

我有一个简单的给这里的人。我有一个使用 Bootstrap 列的 div :

<div class="current-plan col-sm-4 col-xs-12">
</div>

当前计划的 CSS:

.current-plan{
margin-left: 5%;
display: inline-block;
background-color: #000;
height: 150px;
}

我希望当屏幕宽度低于 767 像素时,剩余的 5% 边距消失。

我试过使用 @media 查询,但它似乎没有与之交互。

div 也嵌套在 Bootstraps 容器 div 中:

<div class="container">
<div class="current-plan col-sm-4 col-xs-12">
</div>
</div>

最佳答案

尝试添加!important声明:

@media screen and (max-width: 766px) {
.current-plan{
margin-left: 0px !important;
}
}

您也可以通过将其添加到您的 <body> 中来使用 Javascript :

<script>
var mq = window.matchMedia( "(max-width: 766px)" );
if (mq.matches) {
var el = document.getElementsByClassName("current-plan");
for(var i = 0; i < el.length; i++) {
elems[i].style.marginLeft = "0px";
}
}
</script>

或者直接在 Bootstrap CSS 中编辑样式。

关于html - 如何在低于 767px 宽度时从 DIV 中删除左边距,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33249312/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com