如何判断哪些CSS3属性需添加-webkit-等厂商前缀？

1. 每次添加自定义CSS都需要查caniuse的「Notes」标签吗？ #

不需要每次都查。像isolation: isolate;这类属性，目前Chrome、Firefox、Safari、Edge等主流现代浏览器早已支持标准语法，完全不需要厂商前缀。只有当你需要兼容IE11及更早版本，或者使用非常新的实验性CSS属性时，才需要去确认前缀需求。如果你的网站用户群体以现代浏览器用户为主，直接写标准语法即可。

2. 有没有替代caniuse的方法？ #

• 自动前缀工具：用PostCSS的Autoprefixer插件，WordPress可以通过主题自定义功能或第三方插件集成这类工具。它会根据你预设的浏览器支持范围，自动给需要的CSS属性添加对应前缀，完全不用手动查询。
• 浏览器开发者工具提示：在Chrome、Firefox的开发者工具中编写CSS时，若某个属性需要前缀，工具会自动给出提示或补全前缀，直接使用即可。

3. 有没有全面的速查表类资源？ #

没必要追求通用的全面速查表，因为大部分需要前缀的属性已被现代浏览器支持标准语法。你可以自行整理日常遇到的少数仍需前缀的属性（比如针对极旧浏览器的兼容代码）。另外，MDN的CSS属性文档会在对应页面明确标注是否需要前缀，信息比速查表更准确及时。

4. 为什么部分常见CSS属性也会出现厂商前缀？ #

这是历史遗留问题：早期CSS属性还处于草案阶段时，浏览器厂商为了让开发者提前试用，就用各自的厂商前缀（如-webkit-、-moz-）实现了实验性版本。比如早年的border-radius、box-shadow都需要前缀，但这些属性如今已成为正式标准，主流浏览器都支持标准语法，前缀早已失去存在意义。旧代码中保留前缀，只是为了兼容非常老旧的浏览器版本。

内容的提问来源于stack exchange，提问作者Mr.Coder