CSS背景属性-速记与长格式

我听过您谈到最佳实践,但正如前面提到的,处理和加载时间的差异可以忽略不计。对于何时使用这些规则,除了样式表中有什么意义之外,没有最佳实践。真正的区别在于它们对继承属性的影响不同。设置 background-color: white; 只会覆盖 background-color background 或 背景 背景 background-repeat ,等等。下面是一个例子:

.box {
    background: url(star.png); // set with just background instead of background-image
    width: 100px;
    height: 100px;
    float: left;
    margin: 10px;
}
.box1 {
    background-color: blue;
}
.box2 {
    background: green;
}

与HTML类似:

<div class="box1 box"></div>
<div class="box2 box"></div>

背景 background-image 等等。

当只使用一种颜色时, background: color 和 background-color: color 应该得到同样的结果。

最后可以归结为你们是否喜欢速记而不是单独的声明。通常,速记员会使用合理的默认值,所以没关系。我通常不记得它们的正确顺序(尤其是 font

无论如何,您可能使用了比预期多得多的速记属性。例如, margin 和 padding 是他们的速记员 -top -right , -bottom 和 -left 组件,以及 border border-width , border-color border-style border-[direction]-[attribute] 属性。通过使用 边境