时间戳

首页 > 解决方案 > 在 Firefox 开发者工具中自动将 CSS “简写”转换为“简写”

css - 在 Firefox 开发者工具中自动将 CSS “简写”转换为“简写”

问题描述

在 Firebug 中，CSS 会自动从简写转换为简写。

例子：

div {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0;
    padding-right: 0;

}

然后将由 Firebug 转换为：

div {
    padding: 10px 0;
}

但是，现在当我使用 Firefox 开发者工具时，没有自动 CSS 速记转换。

截图来自

是否有可能让新的 Firefox 开发人员工具自动将普通 CSS 转换为速记 CSS（就像 Firebug 所做的那样）？

标签： cssfirefoxbrowserfirefox-developer-toolscode-inspection

解决方案

不，这是不可能的。Firefox 开发者工具完全按照样式表中每个规则中声明的方式显示属性；从这个意义上说，它本身并不显示属性，而是显示声明。

如果规则有一个padding速记声明，检查器会反映该速记（并允许您将该速记扩展为它的速记，以便您可以单独操作它们）。如果该规则有 4 个速记声明中的两个padding，则检查器仅反映这两个速记。

这是设计使然，并且可以防止为简洁起见而自动将长记号重写为速记会造成的那种混淆（即，不等价于 的padding-top: 10px; padding-bottom: 10px事实）。padding: 10px 0

推荐阅读