2017-02-20 15 views
0

私は次のように定義します。LESS:不要なプロパティの継承

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から継承するため、まだ、menu-level2項目は、font-weight: boldを取得しています。

私は間違っていますか?

達成したいこと:menu-level1-item active要素のみ太字にする必要があります。すべての子どもではありません。

編集:made ul.menu-level2 to div.menu-level2

答えて

2

まず、ul.menu-level2が間違っています。あなたはそれが

div.menu-level2 {} 

する必要がありますので、限り継承が行くように、あなたは追加のaをネストするだけで、あなたが制限されます

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

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

ような何かを行うことができ、 ul class divの要素ということではなく割り当てます menu-level1 aタグは boldであり、子要素ではありません。

あなたがこれを行うにはしたくない場合は、menu-level2のために別のセレクタを追加し、大胆にしたくないが、私はそれをお勧めしません、これらのli要素についてfont-weight: normal;を指定する必要があります。

+0

ありがとうございました! :) – meandeveloper111

関連する問題