Sass セレクタ関数
Sass セレクタ関数は、セレクタの確認と操作に使用します。
次の表に、Sassのセレクタ関数を示します:
| 関数 | 説明 & 例 |
|---|---|
| is-superselector(super, sub) | 2つのセレクタの一致範囲を比較し、つまりsuperセレクタがsubもう一方のセレクタの一致範囲を含むかどうかを判断します。含む場合は true を返し、それ以外の場合は false を返します。 例: is-superselector("div", "div.myInput") 結果: true is-superselector("div.myInput", "div") 結果: false is-superselector("div", "div") 結果: true |
| selector-append(selectors) | 2番目(複数も可)を最初のセレクタの後ろに追加します。
selector. 例: selector-append("div", ".myInput") 結果: div.myInput selector-append(".warning", "__a") 結果: .warning__a |
| selector-extend(selector, extendee, extender) | |
| selector-nest(selectors) | 提供されたセレクタリストからネストしたリストを生成する新しいセレクタを返します。 例: selector-nest("ul", "li") 結果: ul li selector-nest(".warning", "alert", "div") 結果: .warning div, alert div |
| selector-parse(selector) | 文字列のセレクタをselectorセレクタリストに変換します。 例: selector-parse("h1 .myInput .warning") 結果: ('h1' '.myInput' '.warning') |
| selector-replace(selector, original, replacement) | セレクタを指定し、original を replacement で置き換えた後、新しいセレクタリストを返します。 例: selector-replace("p.warning", "p", "div") 結果: div.warning |
| selector-unify(selector1, selector2) | 2つのセレクタを合成して1つの複合セレクタにします。2つのセレクタを合成できない場合は、null 値を返します。 例: selector-unify("myInput", ".disabled") 結果: myInput.disabled selector-unify("p", "h1") 結果: null |
| simple-selectors(selectors) | 複合セレクタを個々のセレクタに分割します。 例: simple-selectors("div.myInput") 結果: div, .myInput simple-selectors("div.myInput:before") 結果: div, .myInput, :before |
その他の拡張