css - LESS を使用して 2 つの親から 1 つにネストできますか

Question

このLESSをセットアップしました。疑問に思っているのですが、2 つの親のうちの 1 つにネストするオプションはありますか?

 input[type="text"].text_field,
 textarea.text_field {
    // style for both

    textarea + & {
      // style for only text area
    }
  }

他のスタイルを追加する必要がありますがtextarea、主なルールを超えて使用したくありません。それで、これは可能ですか？

Answer 1

それらを同じルールに保ちたい場合は、次のようなことを試すことができます。

.text_field {
  color: black;

  input& {
    padding: 5px;
  }

  textarea& {
    padding: 5px;
  }
}

Answer 2

 input[type="text"].text_field, textarea.text_field {
    // style for both
    font-size: 15px;
    padding: 2px 5px;
 }
 textarea.text_field {
    // style for only text area, you can use !important if you want to use different style, and you used it in input[type="text"].text_field, textarea.text_field
    font-size: 13px !impotrant;
 }

ネストの例:

 ul {
   // style
   li {
     // style
     a:link, a:hover, a:visited {
       // style: color, font-size, etc.
     }
     a:hover {
       text-decoration: underline;
     }
   }
 }