CSS 中的星号属性是什么意思？答案

【问题标题】：What does a star-preceded property mean in CSS?CSS 中的星号属性是什么意思？
【发布时间】：2017-01-17 19:44:09
【问题描述】：

我今天在看一个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

【解决方案1】：

这是与“下划线破解”相同的“星号属性破解”。它包括 IE 忽略的属性之前的垃圾（* 最高适用于 IE 7，_ 最高适用于 IE 6）。

【讨论】：

谢谢！我查找了“star property hack”，发现 Ed Eliot 这篇清晰而全面的帖子：“CSS 提示：分别针对 IE 5.x、6 和 7”超过 ejeliot.com/blog/63
除了使用 css hacks，您还可以尝试条件 cmets，例如，查看quirksmode.org/css/condcom.html 以获取更多信息。
需要注意的是，如果您使用星属性 hack，Safari (7.0.1) 及其之前的版本（无法验证）会引发控制台警告。
RIP IE7 和这些类型的“修复”。
注意：“由于条件 cmets 使用 HTML 注释结构，它们只能包含在 HTML 文件中，不能包含在 CSS 文件中”quirksmode.org/css/condcom.html

【解决方案2】：

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

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

不过，使用条件 cmets 更清晰、更安全。

【讨论】：

确实如此。应避免使用无效 CSS 的 CSS hack；你永远不知道未来的浏览器会对它们做什么。
@bobince 我意识到你在过去发表过这样的评论，但我们现在可以绝对确定每个未来的浏览器将如何解释这一点，因为 CSS 解析算法非常严格，并告诉浏览器默默地忽略这样规则。
@m_gol — 不，我们不能。我们不知道未来的 CSS 规范会对属性前的 * 的含义说什么。如果它有意义，那么当前的浏览器将忽略它，从而允许安全地添加扩展。这就是“必须忽略”规则的重点。

【解决方案3】：

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

*{color:#000;}

上述属性将应用于所有 DOM 元素，从而破坏 CSS 中的自然级联。它只能通过专门标记 DOM 元素来覆盖它，该元素以唯一标识符引用开始。示例：

#uniqueValue div strong{color:#f00;}

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

使用通用通配符（例如第一个示例）可能是编写重置样式表的一种快速而肮脏的方法。它既快又脏，因为在通配符之后对表示的精细定义可能会创建一个非常臃肿的样式表。如果您要使用通配符，我建议更具体地使用它，例如：

* strong{color:#f00;}

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

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

【讨论】：

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

【解决方案4】：

这是 IE7 的 hack。

如果你这样写：

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

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

这不是标准的。

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

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

并像这样使用以前的规则：

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

【讨论】：