Question

我正在尝试对网站进行一些CSS更改。当我使用Firebug检查元素时，我找到了一个类bordered，我需要对其进行一些更改。 Firebug告诉我这个类在一个名为Desktop.css的文件中。这些是Firebug为类bordered显示的样式规则：

.bordered {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: -moz-use-text-color #d9d9d9 #d9d9d9;
    border-image: none;
    border-radius: 5px;
    border-style: none solid solid;
    border-width: medium 1px 1px;
}

但是当我查看实际的Desktop.css文件时，我看到的类bordered的样式规则是：

.bordered {
    border: 1px solid #d9d9d9;
    border-top: none;
    border-radius: 5px;
}

我必须做些蠢事！为什么我会在Firebug和实际的CSS文件中看到这样的差异？

Answer 1

Firebug会将您的CSS规则解析为完整格式。

较少杂乱的一个好例子是background属性。

background实际上是一种写作的简写方法

background-color
background-image
background-repeat
background-attachment
background-position

因此，如果我们写background: #f00;，我们将获得红色背景，而背景的所有其他属性将设置为默认值。

Firebug将显示包含默认值的完整值，在本例中为：

background: #ff0000 none repeat scroll 0 0;

为什么Firebug显示的CSS样式与我在CSS文件中看到的不同？

1 个答案: