页面在桌面上看起来正常,不代表在手机上也好用。适配时可以从内容本身开始,而不只是缩小字号。

先设置合理的内容宽度

主体使用弹性宽度和最大宽度,卡片留出适当内边距。避免固定像素宽度导致横向滚动,也要检查长英文、代码和链接是否会撑破容器。

检查触控和焦点

按钮之间要留出足够间距,键盘焦点应清楚可见。导航折叠后仍应能用键盘访问,关闭菜单后焦点位置也要合理。

验证文字和顺序

长标题要能自然换行,标签过多时允许换行。用窄屏模拟器检查页面顺序、横向滚动条和固定元素是否遮挡内容。