Tidak ada cara mudah untuk melayakkan pemilih dari dalam peraturan yang berkaitan. Dengan memenuhi syarat, saya bermaksud menyiapkan nama elemen (contohnya a) ke kelas (contohnya .btn) agar peraturan ditetapkan khusus untuk kombinasi elemen pemilih dan pemilih kelas (misalnya a.btn).
Sehingga hari ini, kaedah terbaik (dan cara yang sah setakat ini) adalah seperti berikut:
.button ( @at-root a#(&) ( // Specific styles for `a.button` ) )Wow, jelas tidak begitu elegan, bukan? Sebaik-baiknya, anda mungkin mahu menyembunyikan sintaksis yang mengerikan ini di sebalik mixin supaya anda tetap menggunakan API yang bersih dan mesra, terutamanya jika anda mempunyai pembangun pemula dalam pasukan anda.
Tentunya sangat mudah:
/// Since the current way to qualify a class from within its ruleset is quite /// ugly, here is a mixin providing a friendly API to do so. /// @author Hugo Giraudel /// @param (String) $element-selector - Element selector @mixin qualify($element-selector) ( @at-root #($element-selector + &) ( @content; ) )Sekarang, tulis semula coretan sebelumnya:
.button ( @include qualify(a) ( // Specific styles for `a.button` ) )Jauh lebih baik, bukan? Masih qualifyboleh kedengaran agak rumit untuk pengedar Sass yang tidak berpengalaman. Anda boleh memberikan alias apabila nama yang lebih deskriptif, seperti when-is.
/// @alias qualify @mixin when-is($args… ) ( @include qualify($args… ) ( @content; ) )Satu contoh terakhir:
.button ( border: none; // Qualify `.button` with `button` @include qualify(button) ( -webkit-appearance: none; ) // Qualify `.button` with `a` @include when-is(a) ( text-decoration: none; ) )