文字列演算子
Sass はいくつかの演算子をサポートしており、それらは文字列を生成します。
-
<expression> + <expression>は、両方の式の値を含む文字列を返します。いずれかの値が引用符で囲まれた文字列の場合、結果は引用符で囲まれます。そうでない場合は、引用符は囲まれません。 -
<expression> - <expression>は、-で区切られた両方の式の値を含む、引用符で囲まれていない文字列を返します。これはレガシー演算子であり、補間を代わりに使用する方が一般的です。
PlaygroundSCSS構文
@debug "Helvetica" + " Neue"; // "Helvetica Neue"
@debug sans- + serif; // sans-serif
@debug sans - serif; // sans-serif
Sass構文
@debug "Helvetica" + " Neue" // "Helvetica Neue"
@debug sans- + serif // sans-serif
@debug sans - serif // sans-serif
これらの演算子は文字列だけでなく、CSSに書き込むことができるあらゆる値で使用できます（いくつかの例外があります）。
PlaygroundSCSS構文
@debug "Elapsed time: " + 10s; // "Elapsed time: 10s";
@debug true + " is a boolean value"; // "true is a boolean value";
Sass構文
@debug "Elapsed time: " + 10s // "Elapsed time: 10s";
@debug true + " is a boolean value" // "true is a boolean value";
⚠️ ご注意！
これらの演算子に頼るのではなく、補間を使用して文字列を作成する方が、多くの場合、よりクリーンで明確です。
単項演算子単項演算子 permalink
歴史的な理由から、Sass は/と-を単項演算子としてサポートしており、1つの値のみを取ります。
/<expression>は、/で始まり、式の値が続く、引用符で囲まれていない文字列を返します。-<expression>は、-で始まり、式の値が続く、引用符で囲まれていない文字列を返します。