有无论如何通过html类与变量样式的HTML元素？

我只是想知道是否有可能具有基于类的名称的具体样式。有无论如何通过html类与变量样式的HTML元素？

例如，引导程序4具有用于边距和填充像一个辅助类：

<div class="m-t-1 p-a-0"></div>

这给出了余量的DIV 1em的顶端，并且从所有侧面移除填充。

我相信他们已经在CSS中预先设计了这个类来达到这个目的。但我很好奇，如果有一种方法来使用类作为变量。

例如：

<div class="fs-x"></div>

其中x可以是任何数字，这个类然后给造型的font-size: x到div。

这可能吗？

谢谢。

2016-10-05 Zlerp

你可以使用一个CSS预处理器，例如SASS或LESS实现这一但是它低于规定的范围内生成静态类是从SASS documentation一个例子：

$class-slug: for !default 

@for $i from 1 through 4 
    .#{$class-slug}-#{$i} 
    width: 60px + $i

发出此CSS：

.for-1 { 
    width: 61px; 
} 

.for-2 { 
    width: 62px; 
} 

.for-3 { 
    width: 63px; 
} 

.for-4 { 
    width: 64px; 
}

2016-10-05 03:57:45 Brian

所有CSS类必须明确定义。所以每次的变化，如果X将需要.css文件存在

2016-10-05 03:58:58 Enzey

你可以在CSS中使用常数例如

$x = 10px; 

img{ 
    margin-bottom : $x; 
}

但是却可以用这种方式

:root { 
    --color-principal: #06c; 
} 

#foo h1 { 
    color: var(--color-principal); 
}

声明变量

2016-10-05 04:01:49

回答