css 判断在支持某些属性的情况下再添加样式
:root { --safe-area-inset-top: 0px; --safe-area-inset-right: 0px; --safe-area-inset-bottom: 0px; --safe-area-inset-left: 0px; --safe-area-inset-constant-top: 0px; --safe-area-inset-constant-right: 0px; --safe-area-inset-constant-bottom: 0px; --safe-area-inset-constant-left: 0px; } @supports (top: env(safe-area-inset-top, 44px)) { :root { --safe-area-inset-top: env(safe-area-inset-top, 44px); --safe-area-inset-right: env(safe-area-inset-right, 34px); --safe-area-inset-bottom: env(safe-area-inset-bottom, 34px); --safe-area-inset-left: env(safe-area-inset-left, 34px); } } @supports (top: constant(safe-area-inset-top)) { :root { --safe-area-inset-constant-top: constant(safe-area-inset-top); --safe-area-inset-constant-right: constant(safe-area-inset-right); --safe-area-inset-constant-bottom: constant(safe-area-inset-bottom); --safe-area-inset-constant-left: constant(safe-area-inset-left); } }
@supports 来实现。
、、
js 判断
window.CSS && CSS.supports('padding: env(safe-area-inset-top)')
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
2022-11-27 leetcode 56. 合并区间 js实现
2018-11-27 css如何实现一个元素高度固定宽度按比例显示?
2018-11-27 多行或者单行文本超出显示点点点,如果保证内容始终垂直居中?