logo标签列表

CSS中的“*”代表什么？

csscss-selectors
68

我一直在查看许多网站（如Facebook和Youtube）的CSS文件。

几乎所有这些文件中都有这段代码：

* {
margin: 0;
padding: 0;
}

奇怪的是，使用Chrome Web开发者工具删除该块不会影响页面布局。

这段代码是什么意思？它在什么时候被使用和为什么要被使用？

可能是因为CSS是生成的，它很可能只是设置了默认的边距和填充。 - Basile Starynkevitch
4
你可能想看一下这个问题：CSS reset是否仍然必要？（https://dev59.com/5FDTa4cB1Zd3GeqPKI1R） - Conrad Frix
9个回答
97

这是一种常见的技术，称为CSS重置。不同的浏览器使用不同的默认边距，导致网站在边距上看起来不同。 * 表示“所有元素”（一个通用选择器），因此我们将所有元素设置为零边距和零填充，从而使它们在所有浏览器中看起来相同。

15

星号 (*) 是通配符，表示所有元素。

* {
    margin: 0;
}

将所有元素的边距设置为0。

10

* 是通配符。

它的含义是将这些样式应用于所有元素。

在此示例中，它将所有元素的 margin 和 padding 设置为 0。这在重置 CSS 文件中比较常见，以便将不同元素的本机浏览器边距/填充重置为共同的值。

4

它将重置页面上所有HTML元素的边距和内边距为0。

某些浏览器可能已经默认执行了此操作，但手动尝试重置所有内容始终是有用的，以防万一。

事实上，许多网站都使用reset.css（或类似文件），打开后您会注意到许多规则可以在每个浏览器中重置所有样式。

没有浏览器默认执行此操作，因为这会使 HTML 内容无法阅读。你有任何例子吗？ - Andreas Bonini
我无法提供任何示例...但我知道有多少不同的浏览器，项目分支，手机浏览器等。“可能”是关键词 :) - Oomta
3
在CSS中，除了您自己的样式之外，每个网页都会应用一些默认样式。这些默认样式定义了像

、
  • 、

    、等元素的某些填充和边距值。令人恼火的是，通常您需要覆盖这些样式以使页面显示正确，但并非所有浏览器制造商都同意默认值。通常，大多数开发者最容易重置所有内边距和外边距为零，以便所有内容表现如预期。 "*"是通配符选择器，将匹配所有元素类型。基本上，该样式表明要重置所有元素的填充/边距为零，从而删除任何默认样式。

    • 3

    这是一个通配符，将所有HTML元素的margin和padding设置为0。

    可以尝试更有趣的写法：

    * {
    font-size: 20pt;
}
    2

    * 是通配符，它选择所有元素。margin: 0; 和 padding: 0; 将所选元素的边界和内边距设置为0，在这种情况下就是所有元素。

    这对于网站开发非常方便，我在每个网站中都使用它。

    3
    值得一提的是，这是一种值得讨论的技术。许多人建议不要在重置时使用通配符选择器。但也有许多人反对重置本身。可以说，这更多是个人偏好而不是普遍最佳实践。 - Greg Pettit
    1

    这是一般 CSS 重置的常见部分。它基本上将所有 (*) 元素的边距和填充设置为 0。然后，您可以根据自己的要求为每个元素添加自己的边距和填充值。

    0

    基本上它是一个通配符。尝试使用以下方法以获得更好的视图：

    div * {
//code here
}
    网页内容由stack overflow 提供, 点击上面的
    可以查看英文原文，
    原文链接