文章/答案/技术大牛

发布

社区首页 >问答首页 >为什么把尺寸放在*上而不是身体上？

问为什么把尺寸放在*上而不是身体上？
EN

Stack Overflow用户

提问于 2014-02-02 06:49:17

回答 2查看 2.2K关注 0票数 0

我已经看到，box-sizing: border-box将避免宽度计算问题。我不知道为什么会出现在*上

*, *:before, *:after {
  -webkit-box-sizing: border-box; 
  -moz-box-sizing: border-box; 
  box-sizing: border-box;
}

下面定义的问题是什么。

body {
  -webkit-box-sizing: border-box; 
  -moz-box-sizing: border-box; 
  box-sizing: border-box;
}

不适用于所有子元素吗？为什么？

html

css

回答 2

Stack Overflow用户

发布于 2014-02-02 06:57:18

它将应用于文档中的所有元素，而不仅仅是body元素。

这样，您就不需要在需要调整大小的所有样式规则中添加大小大小。

请注意，它可能会影响使用*的页面的性能。如果您只需要为几个元素使用它，那么最好为这几个元素指定盒子大小。

票数 1

Stack Overflow用户

发布于 2019-05-25 06:06:30

“*”是通用的CSS选择器，这意味着它选择了页面上的所有元素。

例-1：

每当您选择 body 时，它只对身体进行样式化(记住只有body，而不是它的子)。

HTML:

<body>
  <div class="box-1">box-1</div>
  <div class="box-2">box-2</div>
</body>

CSS:

body {
  padding: 5rem;
  background-color: chocolate;
  border: 2px solid white;
}

结果： 衬垫、背景、边框仅适用于身体

例2：

每当您选择“*”时，它就会对HTML文档中的所有单独元素(包括主体)进行样式化。

HTML:

<body>
  <div class="box-1">box-1</div>
  <div class="box-2">box-2</div>
</body>

CSS:

body {
  padding: 5rem;
  background-color: chocolate;
  border: 2px solid white;
}

结果： 填充、背景、边框应用于所有单独的元素，包括主体。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/21507903

复制

相似问题

问为什么把尺寸放在*上而不是身体上？
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么把尺寸放在*上而不是身体上？EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么把尺寸放在*上而不是身体上？
EN