配图源自Freepik这周做了一个需求，出现了Bug，经排查后发现：同一元素同时设置overflow:hidden和transform-form:preserve-3d样式，会使得后者失去3D效果，也就是相当于transform-form:flat。下面用示例验证一下：.constainer区域设置了transform-style:preserve-3d；.red区域设置了transform:translate3d(20px,20px,10px)；.green区域设置了transform:translate3d(0,0,5px)；?.container{margin:0auto;border-

配图源自Freepik这周做了一个需求，出现了Bug，经排查后发现：同一元素同时设置overflow:hidden和transform-form:preserve-3d样式，会使得后者失去3D效果，也就是相当于transform-form:flat。下面用示例验证一下：.constainer区域设置了transform-style:preserve-3d；.red区域设置了transform:translate3d(20px,20px,10px)；.green区域设置了transform:translate3d(0,0,5px)；?.container{margin:0auto;border-

文章目录​​使styled-component像SPA中使用​​​​step1安装插件​​​​step2根目录下创建`.babelrc`​​​​step3创建`page/_document.js`自定义Document​​​​参考特别感谢​​​​[应用主题]需完成上一步​​使styled-component像SPA中使用step1安装插件yarnaddbabel-plugin-styled-componentsstep2根目录下创建​​.babelrc​​{"presets":["next/babel"],//覆盖nextjs的默认babel配置，以本文件的babel配置为准"plugins"

文章目录​​使styled-component像SPA中使用​​​​step1安装插件​​​​step2根目录下创建`.babelrc`​​​​step3创建`page/_document.js`自定义Document​​​​参考特别感谢​​​​[应用主题]需完成上一步​​使styled-component像SPA中使用step1安装插件yarnaddbabel-plugin-styled-componentsstep2根目录下创建​​.babelrc​​{"presets":["next/babel"],//覆盖nextjs的默认babel配置，以本文件的babel配置为准"plugins"