css通用选择器用_一定要赶上他们:通用CSS选择器

css通用选择器用

The broadest possible selector that can be used in , the universal or "wildcard" selector is also the most powerful. Used as a single selector, a wildcard sets absolutely everything to the values you specify. For example:

可以在使用的可能的最广泛选择器,通用选择器或“通配符”选择器也是最强大的选择器。 通配符用作单个选择器时,会将所有内容绝对设置为您指定的值。 例如:

* { color: red; }

… sets every tag (and as a result, every piece of content, excluding bitmap images) to red. This includes links, headings, paragraphs, table cells, even pseudo-selector states such as :hover and :visited.

…将每个标签(因此,每个内容(位图图像​​除外))设置为红色。 这包括链接,标题,段落,表单元格,甚至是伪选择器状态,例如:hover:visited

The universal selector is the CSS equivalent of a neutron bomb, wiping out everything it is applied to. The universal selector also overwrites the usual inheritance rules in CSS. For example, writing this line after the above declaration:

通用选择器在CSS上等同于中子弹,可将其应用的所有内容清除掉。 通用选择器还会覆盖CSS中通常的继承规则。 例如,在上面的声明之后编写此行:

div { color: black; }

…would normally set all text inside div elements to black; but the previous declaration will overwrite it. You’d need to countermand it by using a variation of the universal selector again:

…通常会将div元素内的所有文本设置为黑色; 但先前的声明将覆盖它。 您需要再次使用通用选择器的变体来抵消它:

div * { color: black; }

While setting all text on a website to red isn’t a realistic option for most sites, the selector can also be used as a helpful mini CSS reset at the start of a stylesheet:

虽然将网站上的所有文本设置为红色对于大多数网站来说都不是现实的选择,但选择器还可以在样式表开始时用作有用的mini CSS重置

* {
	border: none;
	box-sizing: border-box;
}

This eliminates borders on every element by default, and sizes all containers using the border-box model (making the sizing of elements much easier). If you’re prepared for more work, you could also reset padding, margin, and line-height at the same time:

默认情况下,这消除了每个元素上的边框,并使用border-box模型调整了所有容器的大小(使元素的大小确定更加容易)。 如果您准备进行更多工作,则还可以同时重置paddingmarginline-height

* {
	border: 0; padding: 0;
	line-height: 0;
	margin: 0;
	box-sizing: border-box;
}

This requires you to rebuild your CSS, but it does have the benefit of allowing you to start from scratch without depending on (or fighting) built-in browser appearence rules for elements in UA stylesheets.

这需要您重建CSS,但是这样做的好处是,您可以从头开始,而不必依赖(或不使用) UA样式表中元素的内置浏览器出现规则。

A final note: due to its overwhelming nature, the universal selector can slow browser performance, especially on complex sites with a lot of markup: the stylesheet must apply the rules of the universal selector declaration to every tag before the rest of your CSS takes effect. This should be kept in mind as you optimize the CSS for a site.

最后一点:通用选择器由于其压倒性,可能会降低浏览器性能,尤其是在带有大量标记的复杂站点上:样式表必须在所有其余CSS生效之前将通用选择器声明的规则应用于每个标记。 在优化网站CSS时应牢记这一点。

翻译自: https://thenewcode.com/629/Gotta-Catch-Em-All-The-Universal-CSS-Selector

css通用选择器用

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值