是否可以像“@include media-breakpoint-up(900px)”（bootstrap4）这样以像素为单位设置断点？答案

【问题标题】：Is it possible to set breakpoint in pixels like "@include media-breakpoint-up(900px)" (bootstrap4)?是否可以像“@include media-breakpoint-up(900px)”（bootstrap4）这样以像素为单位设置断点？
【发布时间】：2021-01-24 11:16:32
【问题描述】：

我可以在 Bootstrap 4 中使用@include media-breakpoint-up(900px) 构建媒体查询吗？

例如，如果我使用：

@include media-breakpoint-up(900px){
   body: border 2px solid;
}

.css 中的输出将没有媒体查询 -> like this

或者只能通过创建新断点来完成：

$grid-breakpoints: (
    // default breakpoints

    custom-lg: 90px,
);

并使用类似

@include media-breakpoint-up(custom-lg){
   body: border 2px solid;
}

【问题讨论】：

你想完成什么？您是否尝试更改 lg 断点？
我需要为特定宽度的元素指定样式并且不想为其创建新断点

标签： css bootstrap-4 sass media-queries

【解决方案1】：

如果查看media-breakpoint-up mixin，您会发现它需要$name 参数，这是一个断点的名称，不是一个像素值..

@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
    ...
}

但是您可以传入另一个 $breakpoints 映射（第二个参数），其中包含 lg 的新值...

@include media-breakpoint-up(lg,(lg:900px)){
   body { 
       border: solid red 2px;
   }
}

Codeply