在CSS中，星形属性是什么意思？

85

我今天在看一个CSS文件，发现以下规则集：

div.with-some-class {
    display:block;                   
    margin:0;
    padding:2px 0 0 0;
    *padding:1px 0 0 0;
    font-size:11px;   
    font-weight:normal;
    *line-height:13px;
    color:#3D9AD0;
}

星号在* padding和* line-height中是什么意思？

谢谢。

css

— 马吉德·富拉德普尔
source

98

这是“明星财产黑客”，与“下划线黑客”相同。它在IE忽略的属性之前包括垃圾（*最多适用于IE 7，_最多适用于IE 6）。

— 奥佩罗
source

7

谢谢！我查了一下“明星财产黑客”，并找到了Ed Eliot的这篇清晰而全面的文章：“ CSS提示：分别定位IE 5.x，6和7。”通过ejeliot.com/blog/63

— Majid Fouladpour

1

除了使用CSS骇客，您还可以尝试使用条件注释，例如，查看quirksmode.org/css/condcom.html以获得更多信息。

— Capi Etheriel

应该注意的是，如果您使用star属性hack，则Safari（7.0.1）及其之前的版本（无法验证）将引发控制台警告。

— 2014年

RIP IE7和此类“修复程序”。

— ChristoKiwi '17

注意：“由于条件注释使用HTML注释结构，因此只能将它们包含在HTML文件中，而不能包含在CSS文件中” quirksmode.org/css/condcom.html

— George Birbilis

32

在CSS中？没有; 这是一个错误。

由于Internet Explorer某些版本中的错误，它们不会正确忽略无效的属性名称，因此，这是提供特定于这些浏览器的CSS的一种方法。

不过，使用条件注释会更清晰，更安全。

— 昆汀
source

2

确实。应避免使用无效的CSS hack；您永远都不知道将来的浏览器可能会对它们有什么作用。

— 2009年

@bobince我知道您是在过去进行此评论的，但是现在我们可以绝对确定，将来的浏览器将如何解释这一点，因为CSS解析算法非常严格，并告诉浏览器静默忽略此类规则。

— mgol

1

@m_gol —不，我们不能。我们不知道将来的CSS规范将对*property之前的含义说些什么。如果它具有含义，那么当前的浏览器将忽略它，从而可以安全地添加扩展名。这就是“必须忽略”规则的重点。

— 昆汀

8

星号字符是CSS中的有效通配符。单独使用它意味着以下CSS属性将用于DOM中的所有元素节点。例：

*{color:#000;}

上述属性将应用于所有DOM元素，从而克服了CSS中自然的级联。仅可以通过在目标定位开始一个唯一标识符引用的地方对DOM元素进行特别分级来覆盖它。例：

#uniqueValue div strong{color:#f00;}

上述属性将覆盖通配符，并使出现在div中且id属性值为“ uniqueValue”的元素中的所有强元素的文本。

如第一个示例所示，使用通用应用的通配符可能是编写重置样式表的快速而肮脏的方法。这是快速而又肮脏的，因为通配符后的表示形式的细化定义可能会创建一个非常肿的样式表。如果要使用通配符，我建议更具体地使用它，例如：

* strong{color:#f00;}

上面的示例将使所有强元素的文本变为红色，而与未使用唯一标识符指定的其他CSS属性无关。这被认为比使用“！important”声明要安全得多，因为已知该声明会干扰预期行为的自然功能，并且是维护方面的噩梦。

您的示例中的星号位于错误的位置，因为它们似乎出现在属性声明（大括号内的代码）内，并且很可能会导致错误。

4

回答我用Google搜索的内容，即使它不是正确的答案

— Steve

4

这是IE7的骇客。

如果您这样写：

.test {
    z-index: 1;
    *z-index: 2;
}

在所有遵守W3C标准<div class="test"></div>HTMLElement的导航器上，都有一个，z-index: 1但是对于IE7，该元素有一个z-index: 2。

这不是标准的。

要使用W3C Standard实现相同的目的，请按照以下步骤操作：

添加一些Internet Explorer条件注释（这是所有其他导航器的简单HTML注释，因此，这是一种标准方法）。

<！-[如果是IE 7]> <html lang =“ fr” class =“ ie7”> <！[endif]->

<！-[if gt IE 7]> <！-> <html lang =“ fr”> <！-<！[endif]->

并使用以前的规则，如下所示：

.test {
    z-index: 1;
}
.ie7 .test {
    z-index: 2;
}

— 布鲁诺·莱瑟尔
source