3D渲染CSS挑选器

2021-03-14 17:38 jianzhan

近期在High Performance Web Sites blog看到1篇有关css挑选器的文章内容《Simplifying CSS Selectors》,我英文太差,在汉语翻译手机软件和盆友的协助下略微的看懂了1些,看本文必须慎重,严防被我误导,假如你英文强,能汉语翻译作者原文那就更好了,大伙儿都会谢谢你的;

看懂的梳理了以下几点:

1.作者先前的文章内容里说:无需去提升CSS挑选器,由于提升CSS挑选器对网友的特性提高很小,不值得得去计较;这个见解好像有点不对,作者收到了许多指责的意见反馈;
2.David Hyatt的文章内容《Writing Efficient CSS for use in the Mozilla UI》中提到的1条CSS3D渲染标准是:在1条css中,css挑选器是从最右侧刚开始以后先后向左挪动的,直至它不配对CSS标准或配对不正确;因此大家的工作中关键应当放在最右边的CSS挑选器来配对很多的网页页面的元素。

例如这样1个css挑选器:
div div div p a.class0007 {}
这个挑选器有5层,貌似很负责的,可是最右侧的挑选器是A.class0007,在网页页面中仅有1个配对的元素逆向配对(.class0007);

因此这样的挑选器无需担忧他的特性;

3.自然也有1些特性不太好的css挑选器:

A.class0007 * {}

A.class0007 DIV {}

#id0007 > A {}

.class0007 [href] {}

DIV:first-child {}

这些特性不太好的css挑选器关键是由于在最右侧的挑选器能够配对的元素许多,从而减少了网页页面的特性。