从CSS规则拆分属性

Question

我想结合

.alpha {
    border-top: solid 1px #990000 ;
}
.beta {
    border-bottom: solid 5px #990000;
}

类似

.alpha, .beta {
    border: #990000 ;
}
.alpha {
    border-top: solid 1px;
}
.beta {
    border-bottom: solid 5px;
}

它可以更容易地以编程方式更改颜色。这可能吗？我不应该尝试上面的内容，它似乎不适用于Firefox。仅应用最后的规则（即.alpha和.beta），而忽略组合。

由于

Answer 1

示例won't work中的CSS。

你可以使用......

.alpha, .beta {
    border-color: #900;
    border-style: solid;
    border-width: 0;
}

.alpha {
    border-top-width: 1px;
}

.beta {
    border-bottom-width: 5px;
}

jsFiddle