实战中怎么用响应式设计？

使用 CSS Flexbox 或 Grid 布局，设置，用 Chrome DevTools 的 Device Mode 测试各种屏幕尺寸。

响应式设计 Responsive Design

使用 CSS Flexbox 或 Grid 布局，设置 ，用 Chrome DevTools 的 Device Mode 测试各种屏幕尺寸。

词条 #117 / 700 · 第 3 章 · 3.2 页面体验与 Core Web Vitals 核心指标（111–120）

一句话定义

网站使用 CSS 媒体查询，根据设备屏幕尺寸自动调整布局和元素大小。

一件弹力 T 恤，胖瘦都能穿，而且都合身。

使用 CSS Flexbox 或 Grid 布局，设置 <meta name="viewport" content="width=device-width, initial-scale=1">，用 Chrome DevTools 的 Device Mode 测试各种屏幕尺寸。

不要用 User-Agent 检测来重定向到 m.example.com（独立移动站），维护成本高且容易出错。响应式设计是 Google 推荐的标准做法。