第 5 天 移动端适配——手机上的体验

📱 问题

之前的页面在电脑上看着还行，但在手机上：

• 输入框太小，手指点不到
• 表格太宽，需要左右滑动
• 按钮挤在一起，容易误触

🔧 解决方案

用CSS媒体查询（@media）针对不同屏幕尺寸调整布局：

• 小屏幕：单列布局，输入框全宽，按钮变大
• 中屏幕：两列布局
• 大屏幕：三列或四列布局

还添加了 viewport meta 标签，确保页面能正确缩放。

💡 收获

移动端适配不是可选的，是必须的。现在超过60%的流量来自手机。