响应式设计

一、为什么需要响应式设计？1.1 一个页面，千种屏幕打开你的博客，分别在以下设备上查看： 设备 典型宽度 使用场景 手机（竖屏） 375px 地铁上刷文章 手机（横屏） 812px 看视频、看代码 平板 768px - 1024px 沙发上阅读 笔记本 1366px - 1440px 日常办公 台式显示器 1920px+ 多窗口并行 超宽屏 2560px+ 专业工作站 截至 2025 年，全球超过 55% 的 Web 流量来自移动设备。如果一个网站只在桌面端好看，等于放弃了超过一半的用户。 1.2 两种策略：自适应 vs 响应式在响应式设计成为主流之前，存在两种思路： 策略 做法 缺点 自适应（Adaptive） 为手机和桌面各写一套页面（如 m.example.com） 维护两套代码，成本翻倍 响应式（Responsive） 一套 HTML/CSS，根据屏幕尺寸自动调整布局 需要对 CSS 有更深入的理解 响应式设计是 Ethan Marcotte 在 2010...