sass:string

互換性
Dart Sass
since 1.23.0 (バージョン1.23.0以降)
LibSass
Ruby Sass

現在、Dart Sassのみが@useを使用した組み込みモジュールの読み込みをサポートしています。他の実装のユーザーは、代わりにグローバル名を使用して関数を呼び出す必要があります。

string.quote($string)
quote($string) //=> string

$string を引用符で囲まれた文字列として返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.quote(Helvetica); // "Helvetica"
@debug string.quote("Helvetica"); // "Helvetica"
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.quote(Helvetica)  // "Helvetica"
@debug string.quote("Helvetica")  // "Helvetica"
string.index($string, $substring)
str-index($string, $substring) //=> number

$string 内の $substring の最初のインデックスを返します。 $string$substring が含まれていない場合は null を返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.index("Helvetica Neue", "Helvetica"); // 1
@debug string.index("Helvetica Neue", "Neue"); // 11
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.index("Helvetica Neue", "Helvetica")  // 1
@debug string.index("Helvetica Neue", "Neue")  // 11
string.insert($string, $insert, $index)
str-insert($string, $insert, $index) //=> string

$index の位置に $insert を挿入した $string のコピーを返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.insert("Roboto Bold", " Mono", 7); // "Roboto Mono Bold"
@debug string.insert("Roboto Bold", " Mono", -6); // "Roboto Mono Bold"
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.insert("Roboto Bold", " Mono", 7)  // "Roboto Mono Bold"
@debug string.insert("Roboto Bold", " Mono", -6)  // "Roboto Mono Bold"

$index$string の長さよりも大きい場合、$insert は末尾に追加されます。 $index が文字列の負の長さよりも小さい場合、$insert は先頭に追加されます。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.insert("Roboto", " Bold", 100); // "Roboto Bold"
@debug string.insert("Bold", "Roboto ", -100); // "Roboto Bold"
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.insert("Roboto", " Bold", 100)  // "Roboto Bold"
@debug string.insert("Bold", "Roboto ", -100)  // "Roboto Bold"
string.length($string)
str-length($string) //=> number

$string の文字数を返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.length("Helvetica Neue"); // 14
@debug string.length(bold); // 4
@debug string.length(""); // 0
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.length("Helvetica Neue")  // 14
@debug string.length(bold)  // 4
@debug string.length("")  // 0
string.slice($string, $start-at, $end-at: -1)
str-slice($string, $start-at, $end-at: -1) //=> string

インデックス $start-at から始まり、インデックス $end-at で終わる (両端を含む) $string のスライスを返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.slice("Helvetica Neue", 11); // "Neue"
@debug string.slice("Helvetica Neue", 1, 3); // "Hel"
@debug string.slice("Helvetica Neue", 1, -6); // "Helvetica"
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.slice("Helvetica Neue", 11)  // "Neue"
@debug string.slice("Helvetica Neue", 1, 3)  // "Hel"
@debug string.slice("Helvetica Neue", 1, -6)  // "Helvetica"
string.split($string, $separator, $limit: null) //=> list
互換性
Dart Sass
since 1.57.0 (バージョン1.57.0以降)
LibSass
Ruby Sass

$separator で区切られた $string の部分文字列の、角かっこで囲まれたカンマ区切りリストを返します。 $separator はこれらの部分文字列には含まれません。

$limit1 以上の数値の場合、最大でその数の $separator で分割されます (そのため、最大で $limit + 1 個の文字列が返されます)。最後の部分文字列には、残りの $separator を含む、文字列の残りの部分が含まれます。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.split("Segoe UI Emoji", " "); // ["Segoe", "UI", "Emoji"]
@debug string.split("Segoe UI Emoji", " ", $limit: 1); // ["Segoe", "UI Emoji"]
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.split("Segoe UI Emoji", " ")  // ["Segoe", "UI", "Emoji"]
@debug string.split("Segoe UI Emoji", " ", $limit: 1)  // ["Segoe", "UI Emoji"]
string.to-upper-case($string)
to-upper-case($string) //=> string

ASCII 文字を大文字に変換した $string のコピーを返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.to-upper-case("Bold"); // "BOLD"
@debug string.to-upper-case(sans-serif); // SANS-SERIF
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.to-upper-case("Bold")  // "BOLD"
@debug string.to-upper-case(sans-serif)  // SANS-SERIF
string.to-lower-case($string)
to-lower-case($string) //=> string

ASCII 文字を小文字に変換した $string のコピーを返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.to-lower-case("Bold"); // "bold"
@debug string.to-lower-case(SANS-SERIF); // sans-serif
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.to-lower-case("Bold")  // "bold"
@debug string.to-lower-case(SANS-SERIF)  // sans-serif
string.unique-id()
unique-id() //=> string

有効な CSS 識別子であり、現在の Sass コンパイル内で一意であることが保証された、ランダムに生成された引用符で囲まれていない文字列を返します。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.unique-id(); // uabtrnzug
@debug string.unique-id(); // u6w1b1def
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.unique-id(); // uabtrnzug
@debug string.unique-id(); // u6w1b1def
string.unquote($string)
unquote($string) //=> string

$string を引用符で囲まれていない文字列として返します。これは有効な CSS ではない文字列を生成する可能性があるため、注意して使用してください。

プレイグラウンド

SCSS 構文

@use "sass:string";

@debug string.unquote("Helvetica"); // Helvetica
@debug string.unquote(".widget:hover"); // .widget:hover
プレイグラウンド

Sass 構文

@use "sass:string"

@debug string.unquote("Helvetica")  // Helvetica
@debug string.unquote(".widget:hover")  // .widget:hover