LESS CSS :Злоупотребление оператором & при вложении?

Less использует оператор &для улучшения возможностей вложенности .

.header        { color: black;
 .navigation  { font-size: 12px;
    &.class    { text-decoration: none }
  }
}

что приводит к замене &родительским селектором и приводит к объединению фактического права селектора с родительским селектором:.header.navigation.classвместо обычного добавления, что привело бы к тому, что .classбыло бы потомком:.header.navigation.class.

Возможно также следующее(см. также здесь):

.header        { color: black;
 .navigation  { font-size: 12px;
    #some-id &.foo   { text-decoration: none }
  }
}

что привело бы к следующему:#some-id.header.navigation.fooпопробуйте здесь . Подстановка происходит, и у меня есть добавленный селектор(#some-id)к моему родительскому селектору.

Помимо того факта, что я бы никогда не кодил таким образом, так как это, вероятно, быстро испортит вашу таблицу стилей, мой вопрос:

Поскольку эта функциональность не задокументирована, является ли она функцией или, скорее, ошибкой?
Каковы возможные побочные -эффекты?

13
задан Community 23 May 2017 в 11:53
поделиться