星号(*)在CSS选择器中有什么作用？
星号(*)在CSS选择器中有什么作用？
提问于 2009-07-30 03:15:38
我找到了这段CSS代码，然后运行它看看它做了什么，它列出了页面上的每个元素，
有人能解释一下asterisk * 在CSS中的作用吗？
<style>
* { outline: 2px dotted red }
* * { outline: 2px dotted green }
* * * { outline: 2px dotted orange }
* * * * { outline: 2px dotted blue }
* * * * * { outline: 1px solid red }
* * * * * * { outline: 1px solid green }
* * * * * * * { outline: 1px solid orange }
* * * * * * * * { outline: 1px solid blue }
</style>回答 5
Stack Overflow用户
回答已采纳
发布于 2009-07-30 03:18:45
它是一个通配符，这意味着它将选择该部分DOM中的所有元素。
例如，如果我想对整个页面上的每个元素应用边距，您可以使用：
* {
margin: 10px;
}您也可以在子选择中使用此选项，例如，以下代码将为段落标签中的所有元素添加边距：
p * {
margin: 10px;
}您的示例使用了一些css技巧，将连续的边框和边距应用于元素，从而为元素提供多种颜色的边框。例如，由黑色边框包围的白色边框。
Stack Overflow用户
发布于 2009-11-10 20:49:45
您引用的CSS对于web设计者调试页面布局问题非常有用。我经常把它暂时放到页面中，这样我就可以看到所有页面元素的大小，并追踪到，例如，具有太多填充的页面元素会将其他元素推到不合适的位置。
同样的技巧可以只使用第一行来完成，但是定义多个轮廓的好处是，您可以通过嵌套页面元素的层次结构的边框颜色获得可视线索。
Stack Overflow用户
发布于 2009-07-30 03:19:00
*充当通配符，就像在大多数其他实例中一样。
如果您这样做了：
*{
margin: 0px;
padding: 0px;
border: 1px solid red;
}然后所有的超文本标记语言元素将具有这些样式。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/1204275
复制相关文章
相似问题
腾讯云开发者
