Различия

Здесь показаны различия между двумя версиями данной страницы.

--- web_designe:sass:mixin [2020/01/26 17:49]
werwolf [оператором рест]
+++ web_designe:sass:mixin [2023/01/12 12:18] (текущий)
@@ Строка 235: / Строка 235: @@
           box-shadow: 1px 1px 1px #eee, 2px 2px 2px black; }
 </sxh>
+====подключение @content====
+Существует возможность передачи блока стилей в миксин, которые будут расположены среди стилей, подключаемых этим миксином. Эти стили будут размещены вместо директив @content, расположенных внутри миксина. Это даёт возможность создания абстракций, зависящих от конструкций селекторов или директив. Например:
+<sxh scss; title: index.scss>
+@import "minixs";
+ul{
+    @include apply-ly{
+      text-decoration: underline;
+      padding: 5px;
+      color: blue;
+    }
+ }
+</sxh>
+<sxh scss; title: _minixs.scss>
+@mixin apply-ly{
+  li{
+    font-weight: bold;
+    @content;
+  }
+}
+</sxh>
+<sxh css; title: index.css>
+ul li {
+  font-weight: bold;
+  text-decoration: underline;
+  padding: 5px;
+  color: blue; }
+</sxh>