МЕНЬШЕ - передача наборов правил в миксины

Описание

Отдельный набор правил содержит такие наборы правил, как свойства, вложенные наборы правил, объявление переменных, миксины и т. Д. Он сохраняется в переменной и включается в другую структуру; все свойства набора правил копируются в эту структуру.

пример

В следующем примере показано, как передать набор правил в mixin в файле LESS:

pass_ruleset.htm

<!doctype html>
   <head>
      <link rel = "stylesheet" href = "style.css" type = "text/css" />
   </head>

   <body>
      <div class = "cont">
         <h2>Welcome to TutorialsPoint</h2>
         <p>The largest Tutorials Library on the web.</p>
      </div>
   </body>
</html>

Затем создайте файл style.less .

style.less

@detached-ruleset: {
   .mixin() {
      font-family: "Comic Sans MS";
      background-color: #AA86EE;
   }
};

.cont {
   @detached-ruleset();
   .mixin();
}

Вы можете скомпилировать файл style.less в style.css , используя следующую команду -

lessc style.less style.css

Выполните указанную выше команду; он автоматически создаст файл style.css со следующим кодом -

style.css

.cont {
   font-family: "Comic Sans MS";
   background-color: #AA86EE;
}

Вывод

Выполните следующие действия, чтобы увидеть, как работает приведенный выше код -

  • Сохраните приведенный выше html-код в passing_ruleset.htm файл.

  • Откройте этот HTML-файл в браузере, и вы увидите следующий результат.

Определение объема

Все переменные и миксины в отдельном наборе правил доступны везде, где набор правил вызван или определен. В противном случае по умолчанию доступны как вызывающая сторона, так и области определения. Область объявления имеет приоритет, если обе области содержат один и тот же миксин или переменную. Тело отдельного набора правил определяется в области объявления. Он не меняет своей области действия после того, как отключенный набор правил копируется из одной переменной в другую.

В следующей таблице перечислены все типы прицела -

Sr. No. Типы и описание
1 Определение и видимость области действия вызывающего абонента

Переменные и миксины определены внутри отдельного набора правил.

2 Ссылка не приведет к изменению области отдельного набора правил

Просто предоставив ссылки, набор правил не имеет доступа ни к каким новым областям действия.

3 Разблокировка изменит область действия отдельного набора правил

Отсоединенный набор правил может получить доступ к области, будучи импортированным в нее.