動態CSS屬性值取決於它的類/ ID名稱

Question

我想知道是否有方法來動態設置一個CSS屬性值取決於其名稱。例如：

.m-b-5 { 
    margin-bottom: 5px; 
} 

其中5px引用其類/ id名稱。

Answer 1

純CSS無。用CSS的唯一方法是創建所有你在開始使用類：

.m-t-10{ margin-top: 10px } 
.m-t-20{ margin-top: 20px } 
.m-t-30{ margin-top: 30px } 
/* etc margin */ 

.p-t-10{ padding-top: 10px } 
.p-t-20{ padding-top: 20px } 
.p-t-30{ padding-top: 30px } 
/* etc padding */ 

或者你可以用更少/ SCSS /其他一些CSS預處理程序創建一個混合/函數創建的類。

Boostrap V4包含相同的功能，所以check the source code to get the idea。