基本上，我試圖根據傳遞給 SCSS mixin 的值是偶數還是奇數來設定 CSS 值。
做了一些環顧四周，發現蹲著。在帶有 CSS/SCSS 的搜索詞中任何提及奇數/偶數只會導致 :nth-child 結果。
余數運算子在 CSS 中不起作用，因此確定奇數/偶數的方法不起作用。然后我嘗試沿著一個數字除以 2 將導致數字型別或整數型別的路線，這取決于它是偶數還是奇數，不。
我唯一可行的選擇似乎是
$valType1: "odd";
@if $val1 == 2 {
$valType1: "even";
} @else if $val1 == 4 {
$valType1: "even";
} @else if $val1 == 6 {
$valType1: "even";
} @else if $val1 == 8 {
$valType1: "even";
} @else if $val1 == 10 {
$valType1: "even";
} @else if $val1 == 12 {
$valType1: "even";
} @else if $val1 == 14 {
$valType1: "even";
} @else if $val1 == 16 {
$valType1: "even";
} @else if $val1 == 18 {
$valType1: "even";
} @else if $val1 == 20 {
$valType1: "even";
} @else if $val1 == 22 {
$valType1: "even";
} @else if $val1 == 24 {
$valType1: "even";
} @else if $val1 == 26 {
$valType1: "even";
}
@if $valType1 == "even" {
background-color: red;
}
一定有什么事。有什么幫助建議嗎？我是否忽略了一些非常明顯的事情？
謝謝！
uj5u.com熱心網友回復：
這是一個很好的用途，@function而不是mixin。您可以為此使用% 模運算子。
為清楚起見添加了一個@mixin（和另一個選項）。
@function evenOdd( $value) {
$number : blue;
@if ($value % 2 == 0) {
$number : red
}
@return $number;
}
@mixin evenOdd( $value ) {
@if ($value % 2 == 0) {
background-color: red;
} @else {
background-color: blue;
}
}
.selector {
background-color: evenOdd(2);
/* compiles to red */
}
.selector {
background-color: evenOdd(3);
/* compiles to blue */
}
.selector {
background-color: evenOdd(4);
/* compiles to red */
}
/* MIXINS */
.selector {
@include evenOdd(2);
/* compiles to background-color: red */
}
.selector {
@include evenOdd(3);
/* compiles to background-color: blue */
}您可以將其粘貼到https://www.sassmeister.com/ - 并觀看奇跡發生。
uj5u.com熱心網友回復：
Sass 支持數字運算子，因此您可以使用模來計算值的奇偶性。
$valType1: "odd";
@if $val1 % 2 == 0 {
$valType1: "even";
}
@if $valType1 == "even" {
background-color: red;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/418298.html
標籤：
上一篇：影像未按比例縮小/放大