有無論如何通過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

回答