html - 文本和框上的阴影具有不同的 Y 位置

Question

我正在使用一个函数在文本或 html 标记上生成渐变阴影。而且我不明白为什么阴影的角度不一样。

为了在 HTML 标记上获得相同的结果，我必须将阴影的 y 位置除以 2（您必须取消注释Codepen 示例中 SCSS（l.14-l.16）上的这 3 行才能看到结果）

   // @if($i) {
   //   $y: $i/2;
   // }

看起来像

行评论

行未注释

Answer 1

我用@Vinc199789评论回答了这个问题：

“我认为那是因为你旋转了你的右 div，而他是从你旋转的位置计算的。”