SASS 中的與號(&)：在末尾和選擇器內使用它
開發人員在使用與號(&)時經常遇到挑戰SASS 選擇器中的字符，尤其是當它出現在選擇器末尾或內部時。本次調查深入研究了這個特定問題。
所提出的 mixin 嘗試將一些 LESS 程式碼移植到 SASS。但是，由於選擇器中 & 的使用不正確，因此程式碼無法產生所需的輸出。
要理解 & 字元的用途，了解其作為父選擇器佔位符的作用至關重要。當在 mixin 或區塊中使用時，& 表示呼叫 mixin 的選擇器或類別。
在這種情況下，mixin 的預期行為是產生包含呼叫元素的類別名稱的選擇器。例如，如果在
.callerClass .foreverAlone {
...
}
.callerClass .iThink .illNeverWork.callerClass {
color: #123ABC;
...
}但是，由於 & 的位置不正確，提供的程式碼無法實現此目的。要解決此問題，應適當使用& 來表示父選擇器：
@mixin button-variant($color, $background, $border) {
{
...
.foreverAlone{
...
}
.iThink &.illNeverWork {
color: #123ABC;
...
}
}透過此修正的實現，mixin 將正確地將呼叫者類別新增至mixin 中產生的任何巢狀選擇器之前。請記住，& 的放置和使用會顯著影響最終的 CSS 輸出，因此準確使用它至關重要。
以上是如何正確使用 SASS 選擇器中的'&”作為父選擇器引用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
