col-xl-* (Bootstrap 4) 处的静态宽度?
static width at col-xl-* (Bootstrap 4)?
如何在 col-xl-* 中禁止它停止为更大的显示器增长?
当我在我的笔记本电脑(1280 宽度)和台式机(1920)上查看它时,两者都适用于 col-xl,但它在台式机上太大或在笔记本电脑上太小。
<div class="d-flex justify-content-center align-items-center text-center login-div ">
<div class="col-md-6 col-sm-8 col-lg-5 col-xl-3 col-10 rounded-10 mask"></div>
</div>
谢谢。
一种选择是使用 media queries and define a max-width
, probably for Bootstrap's xl breakpoint:
@media (min-width: 1200px) { /* xl */
.your-class {
background: yellow;
max-width: 200px;
}
}
<div class="your-class">Hello</div>
使用上面的代码,如果视口宽度至少为 1200px,具有 class .your-class
的元素的最大宽度将为 200px。
如何在 col-xl-* 中禁止它停止为更大的显示器增长? 当我在我的笔记本电脑(1280 宽度)和台式机(1920)上查看它时,两者都适用于 col-xl,但它在台式机上太大或在笔记本电脑上太小。
<div class="d-flex justify-content-center align-items-center text-center login-div ">
<div class="col-md-6 col-sm-8 col-lg-5 col-xl-3 col-10 rounded-10 mask"></div>
</div>
谢谢。
一种选择是使用 media queries and define a max-width
, probably for Bootstrap's xl breakpoint:
@media (min-width: 1200px) { /* xl */
.your-class {
background: yellow;
max-width: 200px;
}
}
<div class="your-class">Hello</div>
使用上面的代码,如果视口宽度至少为 1200px,具有 class .your-class
的元素的最大宽度将为 200px。