Question

我有以下mixin：

------------------------------------------------------------------
-- Parallel_Addition Test --
------------------------------------------------------------------
with Ada.Text_IO; use Ada.Text_IO;
with Parallel_Addition;

procedure PA_Test is
   package adders is new Parallel_Addition(Natural);
   use adders;
   Data : aliased Array_Type := (1,2,3,4,5,6,7,8,9,10);
   T1, T2 : Adder;
begin
   T1.Set_Slice(Low => 0, High => 4, Item => Data'Access);
   T2.Set_Slice(Low => 5, High => 9, Item => Data'Access);
   loop
      if T1'Terminated and then T2'Terminated then
         exit;
      end if;
   end loop;
   put_Line("The sum is " & Integer'Image(Result.Report));
end PA_Test;

它的用法：

@mixin background-fixed($xPosition: "center", $yPosition: "33%")
background-position: unquote($xPosition) unquote($yPosition)
...

有没有办法通过类名在HTML中定义 $ yPosition ，例如 .photo-background-60 （或其他方式）？我想要动态传递这个值，而不仅仅是定义100个具有所有可能值的相同类。

Answer 1

不，目前Sass无法实现。

它可能永远不会。

Sass是一个CSS 预处理器，因此在浏览器可以使用它之前将其编译为CSS。获取属性，解析它以查找数字，然后将字符串转换为整数所需的功能可能永远不会实现，因为CSS是样式语言。

虽然CSS确实提供了选择器来选择部分匹配的类，例如：

[class*="photo-background-"]{}

哪个元素与以photo-background-开头的类匹配。但是，您无法从类名中动态设置背景位置。

只需使用Javascript。

使用SASS动态生成css类？

1 个答案:

不，目前Sass无法实现。