javascript - Mixin 不适用于元素，但 box-shadow 可以

Question

我正在尝试通过 mixin 向元素添加框阴影，但它不起作用。当我将 box-shadow 放入元素中时，它工作得很好，但不会进入 mixin。也许我遗漏了一些小东西，但根据 FreeCodeCamp 上的指南，它应该可以正常工作。任何帮助都是极好的

@mixin project-drop-shadows($offsetX, $offsetY, $color) {
  box-shadow: $offsetX, offsetY, $color;
  -webkit-box-shadow: $offsetX, $offsetY, $color;
  -moz-box-shadow: $offsetX, $offsetY, $color;
}

.project-tile{
 @include project-drop-shadows(5px, 10px, yellow);
  box-shadow: 5px 10px grey;
}

标签： javascripthtmlcsssass

Answer 1

@mixin box-shadow($x-axis: 0, $y-axis: 1px, $color: $default) {
  box-shadow: $x-axis $y-axis $color;
}

.box-shadow {
  width: 100px;
  height: 100px; 
  background: #333;
  margin: 50px;
  @include box-shadow(5px, 5px, red)
}

小提琴你可以检查一下。它工作正常。