transform-style:preserve-3d能力检测？
关注者
48被浏览
10,796登录后你可以
不限量看优质回答私信答主深度交流精彩内容一键收藏
post 90s，图形爱好者
今天工友也遇到这个问题，这确实是一个巨坑啊，用常规方式获取的话，有些浏览器会很自信的认为自己支持（哪来的自信）。所以这个问题可以曲线的来解决。代码如下：
const highEnd = (function() {
try {
const canvas = document.createElement('canvas');
return !!(window.WebGLRenderingContext && (canvas.getContext('webgl') || canvas.getContext('experimental-webgl')));
} catch (e) {
return false;
}
})();
通过判断浏览器是否能获取webgl绘图上下文的方式来判断浏览器是否支持css3的3d透视效果。webgl和css3d在实现上的硬件依赖是有点类似的，都需要GPU的支持（css3d的透视效果必须得到gpu的支持，在现如今的合成化渲染机制下。css3d的实现就是cpu把元素光栅化成bitmap，然后利用gpu＋元素的matrix3d等描述进行合成操作）。所以浏览器如果支持webgl就一定支持css3d。