知识点记录-响应式

响应性指的是项目在不同的分辨率或者设备下面可以显示同样的一个页面效果 方案：

1. js处理：可以监听页面的resize然后做出相应的改变
2. css处理：使用css媒体查询，在不同的屏幕尺寸下使用不同的css
3. 移动端适配：使用相对单位rem/em/vw/vh/百分比
4. 异形屏适配（安全区域）：使用viewport-fit：cover，根据需求设置safe-area-insert-left/right/top/bottom（安全区域距离左/右/上/下的距离）
5. 插件：tailwindcss