将两个css设置合并为一个

Question

我有以下css：

.transaction-info {
    display: inline-block;
    margin-bottom: 20px;
}
.order-info {
    padding-left: 150px;
    display: inline-block;
    margin-bottom: 20px;
}

我想把它组合成一个，我该怎么做？

Answer 1

开始吧。

.transaction-info, .order-info { 
      display: inline-block; 
      margin-bottom: 20px; 
 }
.order-info {
      padding-left: 150px;
}

不必在不同的选择器中重写相同的属性，您可以使用,来声明选择器，而不是声明具有相等值的公共属性，因为其他class唯一的其余属性可以单独声明，所以在这里，由于display: inline-block;和margin-bottom: 20px;是具有相同值的公共特性，您可以共同定义它们，其余的是padding-left: 150px;，可以为.order-info 单独声明

Answer 2

.transaction-info, .order-info 
{
    display: inline-block;
    margin-bottom: 20px;
}
.order-info 
{
    padding-left: 150px;
}

Answer 3

类似这样的东西：

.transaction-info, .order-info {
    display: inline-block;
    margin-bottom: 20px;
}
.order-info {
    padding-left: 150px;
}