html - 合并 CSS 中的相似元素？

Question

我有一个简单的 CSS，其元素完全相同，除了背景图像的文件名。我有超过 50 个这样的。我能以某种方式将它们合并到一个使用参数的元素中吗？或者其他类似的解决方案？

.btnAdd {
    background-image:url(Images/Buttons/btnadd.png);
    background-color:transparent;   
    width:34px;     
    height:34px;          
    cursor:pointer;     
    border-style:none;   
 } 
.btnAdd:hover {
    background-image:url(Images/Buttons/btnadd_h.png); 
 } 
 .btnFilter {
    background-image:url(Images/Buttons/btnFilter.png);
    background-color:transparent;   
    width:34px;     
    height:34px;    
    cursor:pointer;     
    border-style:none;   
   } 
   .btnFilter:hover {
    background-image:url(Images/Buttons/btnFilter_h.png); 
   }
   ....
   ....

谢谢，科比。

Answer 1

创建一种通用样式并将其添加到您的按钮中，如下所示。

.btnAdd {
background-image:url(Images/Buttons/btnadd.png);
} 
.btnCommon {
background-color:transparent;   
width:34px;     
height:34px;          
cursor:pointer;     
border-style:none;   
} 

在您的按钮中添加如下所示。

 <button class="btnCommon btnAdd">Something</button>