여러 선언에 동일한 선언을 적용하는 방법은 무엇입니까?

Question

새 레이아웃에서 이전 템플릿 인프라를 수용하기 위해 CSS에서 해킹을하고 있습니다. . 우리의 메뉴는

는 이러한 목표를 달성하려고 노력하는 내가에있어 섹션에 대응, '운영'상태를 가지고 내가 쓴 :

div#left-col ul li.cidades.Cidades a, div#left-col ul li.amizade.Amizade a, div#left-col ul li.encontros.Encontros a,div#left-col ul li.idade.Idade a { 
    display:block; 
    background:transparent url(http://bp.i.bol.com.br/v11/menu-esq-a.png) no-repeat scroll -161px -4px; 
    color:white; 
    width: 166px; 
} 

을하지만 그냥 작동하지 않습니다! 스타일은 요소 중 하나에 만 적용됩니다. 내가 문제를 해결하려면이 코드를 작성 결국 :

div#left-col ul li.cidades.Cidades a { 
    display:block; 
    background:transparent url(http://bp.i.bol.com.br/v11/menu-esq-a.png) no-repeat scroll -161px -4px; 
    color:white; 
    width: 166px; 
} 

div#left-col ul li.amizade.Amizade a { 
    display:block; 
    background:transparent url(http://bp.i.bol.com.br/v11/menu-esq-a.png) no-repeat scroll -161px -4px; 
    color:white; 
    width: 166px; 
} 

div#left-col ul li.encontros.Encontros a { 
    display:block; 
    background:transparent url(http://bp.i.bol.com.br/v11/menu-esq-a.png) no-repeat scroll -161px -4px; 
    color:white; 
    width: 166px; 
} 

div#left-col ul li.idade.Idade a { 
    display:block; 
    background:transparent url(http://bp.i.bol.com.br/v11/menu-esq-a.png) no-repeat scroll -161px -4px; 
    color:white; 
    width: 166px; 
} 

을하지만

편집

.... 문제 나 해결책을 이해하지 : 여기가 난 HTML 코드입니다 이 스타일을 적용하려고 시도 :

<div id="left-col"> 
<ul> 
<li class="amizade Idade"><a href="#">Amizade</a></li> 
<li class="cidades Idade"><a href="#">Cidades</a></li> 
<li class="encontros Idade"><a href="#">Encontros</a></li> 
<li class="idade Idade"><a href="#">Idade</a></li> 
</ul> 
</div> 

두 개의 반복 된 단어가 클래스에 나타나는 경우에만 스타일을 적용하고 싶습니다.

EDIT 2했는데

div#left-col ul li a{outline: 0px dashed red;display:block; background:transparent url(menu-esq-a.png) no-repeat scroll 0px -4px; height:22px; padding:8px 0 0 23px; margin:0; font-family: Arial, Sans-serif; font-weight: bold; font-size: 14px; text-decoration:none; color:#00574a} 

가 되려면 :이 하나 위에 올바른 선언 (쉼표 뒤에 많은 요소 것들)을 이동시킴으로써이 문제를 해결

my의 "default"상태. 이상한, 가장 구체적인 선언이 덜 수상한 것이라고 생각했기 때문에.

Answer 1

당신은 이미 모든 항목 (이 Idade, 그리고 그것은 각 요소의 class atttribute의 일부)에 적용되는 일반적인 CSS 클래스가 있습니다.

이는 해당 클래스에만의 스타일을 선언하기에 충분 (권장)는 것을 의미하기 때문에

div#left-col ul li.Idade { 
    display:block; 
    background:transparent url(/v11/menu-esq-a.png) no-repeat scroll -161px -4px; 
    color:white; 
    width: 166px; 
} 

측면 참고로, 다른 이름이 공통 클래스에 대한 더 적합 할 수있다, 요소의 내용 중 하나만이이 이름과 일치합니다. menuItem과 같은 이름은 Idade IMO보다 훨씬 설명력이 있습니다.