漢堡包菜單，如何改變十字架的顏色

Question

我該怎麼做，因爲我有一個問題。 這個菜單上的X按鈕出現了問題，我自己做了，而且一切正常，但是當我嘗試更改X的顏色時出現錯誤。 我想將X的顏色改爲黑色。 Theres a code

<button class="js-menu menu" type="button"> 
    <span class="bar"></span> 
</button> 

<nav> 
    <ul> 
     <li>Lorem ipsum</li> 
     <li>Lorem ipsum</li> 
     <li>Lorem ipsum</li> 
     <li>Lorem ipsum</li> 
     <li>Lorem ipsum</li>  
    </ul> 
</nav> 

Answer 1

更改類.active:after.active:before

.active & { 
    background: none; 
    &:after, 
    &:before{ 
    background: red; 
    } 

http://codepen.io/pranesh-r/pen/gwkNwY

Answer 2

你可以改變顏色與.active類

.active & { 
    background: none; 
    &:before, 
    &:after { 
     top: 0; 
     background:red 
    } 
} 

Answer 3

的背景將background color添加到CSS中的僞選擇器中。將以下內容添加到您的代碼中

.active .bar::before, .active .bar::after { 
    top: 0; 
    background: #000; 
}