css類中的嵌套跨度

-1

我使用必需的驗證字段編寫了一個動態表單，目前我有一個名爲errorRequired的父類，它帶有一個名爲x-form-label的嵌套類，這個類內部有一段文本，它正在工作除了正確的span我的CSS規則，我想改變顏色爲紅色......css類中的嵌套跨度

.errorRequired { 
    font-style: oblique; 
    color: $mweb-colour-red; 
    >.x-form-label{ 
    &span { 
     color: red; 
    } 
    } 
}

並編譯CSS

.errorRequired{ 
    font-style:oblique; 
    color:red 
} 
.errorRequired span{color:red}

我在做什麼錯？

預先感謝您

來源

2016-02-03 inane

我們需要看到您的HTML以及。在codepen.io（這支持sass）之類的東西上發佈一個例子。 – JamieC

我認爲問題可能是如何管理Sencha觸摸標籤..： - | – inane

發佈只有html和css的示例。得到這個工作，然後添加你的js庫，我們會看看是否會打破它。 – JamieC

您必須使用&代替>。

.errorRequired { 
    font-style: oblique; 
    color: $mweb-colour-red; 
    & .x-form-label{ /* here, I changed > to & */ 
    &span { 
     color: red; 
    } 
    } 
}

或

.x-form-label { 
    .errorRequired & span { 
     color: red; 
    } 
}

來源

2016-02-03 11:34:48

它不適合我...我不知道發生了什麼... – inane

http://sass-lang.com/documentation/file.SASS_REFERENCE.html#parent-selector –

您可以嘗試其他策略： .x-form-label {.errorRequired＆span {}} –

你有跨度直接旁邊的符號，這將「跨度」追加到類的「X形標籤」的。這會將選擇器輸出爲.errorRequired > .xform-labelspan。

你實際上並不需要的符號，那麼試試這個來代替：

.errorRequired { 
    font-style: oblique; 
    color: $mweb-colour-red; 
    >.x-form-label{ 
    span { 
     color: red; 
    } 
    } 
}

跨度選擇應該然後輸出爲.errorRequired > .xform-label span

來源

2016-02-03 11:35:37 JamieC

它不適合我...我不知道發生了什麼...... – inane

css類中的嵌套跨度

回答

相關問題