使用Sass'Breakpoint Extension编写垂直媒体查询的首选方法-Java 学习之路

使用Sass扩展断点，是否有一种首选方法来编写只有查询值的单个参数的垂直媒体查询？

这是我最终要完成的一个例子：

@media (max-height: 50em) {
  .item {
    font-size: 2em;
  }
}

或者，我应该为这些样式做一个简单的“即时”媒体查询，如：

.item {
  @media (max-height: 50em) {
    font-size: 2em;
  }
}

这是可以用变量处理的东西吗？

我的样式是“移动优先”，因此本网站上的所有其他媒体查询都使用断点的默认“最小宽度”设置 .

谢谢！

1 回答

您可以执行以下操作：

$vertical: 'max-height' 50em;

.item {
  @include breakpoint($vertical) {
    font-size: 2em;
  }
}

您还可以使用其他查询包含高度查询，如下所示：

$mixed: 15em ('max-height' 50em);

.item {
  @include breakpoint($mixed) {
     font-size: 2em;
  }
}

回复于 2024-05-05T12:29:02+08:00