CSS选择器样式

这个问题很简单，可能反映了我对CSS的缺乏经验，但是

创建样式表时，我喜欢显式指定“*”通配符，因此：

*.TitleText {

而不仅仅是

.TitleText {

我发现它提醒我TitleText应用于“any”标记，并且可以被后续的h1.TitleText覆盖。也许我只是喜欢这个，因为在很长一段时间里，我没有正确理解整个CSS选择器的概念，当我意识到第二个（上面的）只是第一个的简写时，很多东西“点击”

---

我所做的是坏习惯，好习惯，还是没有好习惯？

我不知道这是好是坏，但我已经做CSS工作作为web应用程序开发的一部分好几年了，我从未见过有人使用*字符。

我认为这不重要，但我在学习时所看到的例子中没有一个使用通配符格式，所以我学会了不用星号

而且，没有一个生成CSS的工具是这样做的，因此使用星号，如果您选择将CSS放入这样一个工具中，您可能会面临自动工具清除格式的风险

---

为了与大多数其他web开发人员保持一致，我可能会建议您删除星号，这样您就不必与其他开发人员打交道，他们会问您为什么要在其中添加星号。

我认为*是隐含的，所以他们也会这样做

我不确定，但如果您这样做可能会导致一些问题：

span.style { color: red; }
*.style { color: blue; }

*样式可能会替代跨度样式。但我可能错了，因为span.style是一个更具体的选择器

我觉得你这么做很有趣，尽管我完全明白为什么！在CSS中使用DOS提示符/shell语法。最后，您可能会进一步混淆自己，因为在Shell中，您看到的是文件扩展名，但在CSS中，它实际上映射到一个类

所以我的意思是，它适用于类选择器，但也有点适用于ID选择器。例如：

span#id { ... }
*#id { ... }

---

…而且它看起来不再像Shell语法。：）就我个人而言，我不会像你那样做，因为这可能会让人困惑，但我不认为你在破坏任何东西。

就我个人而言，我倾向于在对所有标记应用规则时只使用*。它在*.class{}的情况下是多余的，但在.class*{}的情况下很有用

---

我在一些地方读过，但没有证实，*选择器会影响性能。除非我需要，否则我不会使用它，因为我通常更喜欢更明确一点，但这只是我个人的偏好

这是多余的，假设*意味着“世界上所有可能的事情”，没有*也意味着同样的意思。我通常在undo.css中使用*{margin:0；padding:0}来重置边距和填充，但从不将其用作伪选择器

我从未见过有人使用这样的通配符，我怀疑它会优先于只指定类。其他修改样式的人可能会被迫继续使用这种语法。这就是为什么他们的课程不起作用的原因。

这既不好也不坏，但（完全）是多余的

---

编辑：事实上，我认为这很糟糕，因为它可能会让人困惑（对于人类来说，而不是解析器）。

*。即使span.class更重要，class也会覆盖span.class

我认为*.class没有实际用途，应该使用！重要的声明，而且只是稀疏的

我使用*的唯一原因是删除所有的填充和边距，实际上我总是这样做，这是我写下的第一条css语句：）

还有很多基于“*html”的css攻击在IE6和更低版本中不起作用

---

我会把它标记为坏习惯。

就CSS规范而言，您的两个示例具有相同的含义。然而，在实践中也存在潜在的问题。我所能看到的最大的问题是，一些浏览器可能在规则权重方面对

*

造成错误，因此可能会失去优先权（尽管我不知道有哪种浏览器会这样做——这不会让我感到惊讶）。人们也普遍认为，出于性能原因，类选择器应该始终包含一个特定的标记名，尽管我不能详细地引用。显然，使用带有标记名（

span.foo

）的类选择器比不使用标记名（

#bar

）的类选择器要快，而使用没有标记名的ID选择器比使用标记名（

#bar

）的类选择器要快。

编辑：这表明可能存在性能问题。有些人似乎认为我是某种在外面咆哮的人

---

虽然我不确定，但我想给你一个警告！考虑下面的标识符：

div#foo a.bar {}

我听说，例如jQuery，它使用css，在上面的例子中，它会遍历DOM，首先查找div，然后检查它们是否有一个#foo的id，然后查找一个A标记，最后再查看它是否为classed.bar

我对*的担心是，浏览器可能会遍历DOM查找所有标记，然后查找.bar，而不是本质上只查找“bar”属性——这是DOM的两个扫描，而不仅仅是一个扫描。可能差别极小，但如果您的语法出现在电波中，则我们需要安装更多的太阳能电池板。

根据规范：

5.3通用选择器

通用选择器，写为“*”， 匹配任何元素类型的名称。 它匹配表中的任何单个元素 文档树

如果通用选择器不是 简单选择器的唯一组件， 可以省略“*”。例如：

span#id { ... }
*#id { ... }

• *[lang=fr]

  和

  [lang=fr]

  是等效的

• *.warning

  和

  .warning

  是等效的

• *#myid

  和

  #myid

  是等效的

因此，.TitleText和*.TitleText是等价的

/** 
 * This matches an element with the class `alert` within
 * an `article` element
 */
article *.alert { /* ... */ }