2017-02-20 2 views
0

나는 다음과 같은 정의 : LESS : 원하지 않는 속성 상속

하지만 그들은 menu-level1에서 상속 때문에 여전히 menu-level2 항목, font-weight: bold을 받고

ul.menu-level1 { 
 

 
     li.menu-level1-item { 
 
      font-size: @font-size-large; 
 

 
      &.active { 
 
       font-weight: bold; 
 
      } 
 
     } 
 
    } 
 

 
    div.menu-level2 { 
 

 
    }
\t <ul class="menu-level1"> 
 
\t \t <li class="menu-level1-item"><a href="/">some</a></li> 
 
\t \t <li class="menu-level1-item has-submenu active"><a href="/">some</a> 
 
\t \t \t <div class="menu-level2"> 
 
\t \t \t \t <ul> 
 
\t \t \t \t \t <li class="menu-level2-item"><a href="/">some</a></li> 
 
\t \t \t \t </ul> 
 
\t \t \t </div> 
 
\t \t </li> 
 
\t </ul>
.

내가 뭘 잘못하고 있니?

달성하고자하는 것 : menu-level1-item active 요소 만 굵게 표시해야하며 모든 하위 항목도 표시해서는 안됩니다.

편집 : made ul.menu-level2 to div.menu-level2.

답변

2

우선 ul.menu-level2이 잘못되었습니다. 당신은 그 classul 요소 div에하지를 할당하는, 그래서해야

div.menu-level2 {} 

지금까지 상속이가는대로, 당신은

ul.menu-level1 { 
    li.menu-level1-item { 
    font-size: @font-size-large; 

    &.active { 
     > a { 
     font-weight: bold; 
     } 
    } 
    } 
} 

같은 것을 추가 a 만 제한됩니다 중첩 할 수 있습니다 menu-level1a 태그는 자식 요소가 아닌 bold이어야합니다.

이 작업을 수행하지 않으려면

는, 당신은 menu-level2 또 다른 선택기를 추가하고 대담하지 않으려는 li 요소에 대한 font-weight: normal;를 지정해야합니다,하지만 난 그것을 권하고 싶지 않다.

+0

감사합니다. :) – meandeveloper111