·safe-area-handling
</>

safe-area-handling

cap-go/capgo-skills

有关在 iPhone 刘海、动态岛、主页指示器和 Android 切口的 Capacitor 应用程序中处理安全区域的完整指南。涵盖 CSS、JavaScript 和本机解决方案。当用户在现代设备上遇到布局问题时,请使用此技能。

29安装·2热度·@cap-go

安装

$npx skills add https://github.com/cap-go/capgo-skills --skill safe-area-handling

SKILL.md

Handle iPhone notch, Dynamic Island, home indicator, and Android cutouts properly.

Safe areas are the regions of the screen not obscured by:

| safe-area-inset-top | Notch/Dynamic Island/status bar | | safe-area-inset-bottom | Home indicator/navigation bar | | safe-area-inset-left | Left edge (landscape) | | safe-area-inset-right | Right edge (landscape) |

有关在 iPhone 刘海、动态岛、主页指示器和 Android 切口的 Capacitor 应用程序中处理安全区域的完整指南。涵盖 CSS、JavaScript 和本机解决方案。当用户在现代设备上遇到布局问题时,请使用此技能。 来源:cap-go/capgo-skills。

查看原文

可引用信息

为搜索与 AI 引用准备的稳定字段与命令。

安装命令
npx skills add https://github.com/cap-go/capgo-skills --skill safe-area-handling
分类
</>开发工具
认证
收录时间
2026-02-09
更新时间
2026-02-18

快速解答

什么是 safe-area-handling?

有关在 iPhone 刘海、动态岛、主页指示器和 Android 切口的 Capacitor 应用程序中处理安全区域的完整指南。涵盖 CSS、JavaScript 和本机解决方案。当用户在现代设备上遇到布局问题时,请使用此技能。 来源:cap-go/capgo-skills。

如何安装 safe-area-handling?

打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等) 复制并运行以下命令:npx skills add https://github.com/cap-go/capgo-skills --skill safe-area-handling 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code 或 Cursor 中使用

这个 Skill 的源码在哪?

https://github.com/cap-go/capgo-skills