CSS에서 적절한 클래스 상속?

Question

CSS에 대한 클래스 상속과 혼동을 느낍니다.

<ul id='grok'> 
    <li class='foo'></li> 
<ul> 

때때로 나는 지금 내가이 일을 해요, 리튬 요소의 색상과 클래스 이름을 변경하려면 : :이있는 즉

#grok li, .red { 
    background-color: red; 
    margin: 5px; 
    padding: 5px; 
    cursor: hand; 
    cursor: pointer; 
    text-align: left; 
} 

#grok li.green { 
    background-color: green; 
    margin: 5px; 
    padding: 5px; 
    cursor: hand; 
    cursor: pointer; 
} 

#grok li.blue { 
    background-color: blue; 
    margin: 5px; 
    padding: 5px; 
    cursor: hand; 
    cursor: pointer; 
} 

을, 모든 정의는 있습니다 그들의 색깔을 제외하고 동일. 다음과 같이 압축 할 수 있습니까?

#grok li { 
    background-color: white; 
    margin: 5px; 
    padding: 5px; 
    cursor: hand; 
    cursor: pointer; 
    text-align: left; 
} 

#grok li.red { 
    background-color: red; 
} 

#grok li.green { 
    background-color: green; 
} 

#grok li.blue { 
    background-color: blue; 
} 

? 그것은 함께 일하는 것이 훨씬 더 즐겁습니다. 내 유일한 요구 사항은 클래스 이름에 의해 내 ul 항목에서 요소를 찾을 수있을 것입니다, 그래서 내가 jquery를 사용하여이 클래스 이름 'li.blue'등 (그렇지 않으면 요소를 찾을 수 있어야합니다. 나는이 별도의 클래스들을 필요로하지 않을 것이다).

감사합니다.

Answer 1

예. 가능합니다. 후자의 규칙은 초기보다 구체적이므로 무시합니다.

AFAIK 더 이상 cursor:hand이 필요 없습니다.