SASS函数能否返回vh与px混合运算的实际像素结果？

首先明确：不行。原因在于SASS是预编译工具，它的运算逻辑在代码编译阶段就完成了，但vh是依赖浏览器视口尺寸的动态单位，只有浏览器运行渲染页面时，才能知道100vh对应的具体像素值——SASS在编译时根本拿不到这个数据，自然没法算出混合运算后的实际像素结果。

看你的示例函数：

@function scren_height() {
  $size: calc(100vh - 1px + 1px);
  @return $size;
}

SASS不会自动把calc(100vh -1px +1px)简化成100vh，因为它不会解析calc()内部的运算，只会把整个calc()表达式原封不动输出到最终CSS里，让浏览器在运行时去计算。

如果想简化这类能抵消的静态运算，可以手动在SASS里处理：

@function screen_height() {
  // 先让SASS计算静态px的抵消
  $px-adjustment: -1px + 1px;
  @if $px-adjustment == 0px {
    @return 100vh;
  } @else {
    @return calc(100vh + #{$px-adjustment});
  }
}

这样编译后会直接输出100vh，因为SASS能在编译阶段算出-1px +1px = 0px，进而返回简化后的结果。

再强调一遍核心：

• 只要涉及vh/vw这类动态视口单位，混合运算的实际像素值只能由浏览器在运行时通过calc()计算，SASS做不到提前算出结果。
• 只有纯静态单位（比如px、em之间的固定运算），SASS才能在编译时直接算出结果并返回。

内容的提问来源于stack exchange，提问作者Alexander Philips