01
竖屏阅读路径
窄屏下卡片改为单列排布，入口、专题、资讯按顺序往下排列，一次只关注一块内容。
九游网页版入口官网手机端适配中心
手机屏幕比电脑窄，页面的排布方式也会跟着变化。这里按设备宽度整理了一套查看方式：竖屏时单列顺序往下滑，横屏时目录自动展开两列，字号放大后卡片跟着变高。手机、平板、小屏设备都能按同样的路径找到入口、专题和最新内容。
09
适配要点
04
设备场景
05
场景速览卡
查看前确认
手机打开入口前，把这几件事确认一遍
大部分显示异常都不是页面本身的问题，而是浏览器设置或字号档位带来的差异。先看下面四点，多数情况当场就能解决，不用反复刷新。
- 浏览器保持最新版本。较旧的内核可能不识别圆角、玻璃模糊等样式，页面会退化成朴素排版，但不影响内容阅读。
- 关闭“桌面版网站”选项。开启后浏览器会按宽屏渲染，手机上会看到被横向压缩的版面，需要左右拖动才能看全。
- 系统字号调大属正常表现。字号放大后卡片和按钮会一起增高，滚动距离变长，内容本身不会缺失。
- 弱网先等文字出现。图片按需加载，文字先到、图片后到，滑动时不要急着反复下拉刷新。
竖屏优先
入口区块从上到下依次排列，向下滑动就能看完整段内容，不需要左右拖动。
适配目录
九项手机端适配要点
从屏幕方向、点击区域到加载顺序，逐条对应手机浏览器上会遇到的实际情形。
02
横屏宽幅布局
旋转屏幕后目录自动展开为两列，长标题不再折行，适合一次浏览较多条目。
03
屏幕尺寸等比缩放
从 5.5 英寸小屏到 11 英寸平板，卡片宽度与留白按屏幕比例调整，不出现挤压重叠。
04
触屏点击热区
主要按钮高度保持在 44px 以上，手指点按不容易偏，边缘位置也留出了安全距离。
05
字号与页面缩放
跟随系统字号设置，放大后文字自动换行，标签与徽章同步增高，不会盖住相邻内容。
06
流量与加载顺序
图片按需加载，弱网下先呈现文字与目录结构，避免整屏空白等待。
07
添加到桌面
通过浏览器菜单生成快捷方式，下次从桌面一步打开，省去输入网址的步骤。
08
夜间浏览亮度
深色底本身亮度较低，夜间翻阅专题目录时眼睛负担更小，可再配合系统护眼模式使用。
09
后台切换与回到前台
切到其他应用后页面暂停刷新，回到浏览器会停在原来位置，继续往下滑即可。
设备对照
四种常见设备的显示表现
同一份内容在不同设备上排布方式不同，对照下面几行可以快速判断当前显示是否正常。
设备场景
显示表现
操作建议
设备场景手机竖屏 5.5–6.8 英寸
显示表现单列排布，卡片上下堆叠，标签换行显示
操作建议单手握持，用拇指上下滑动，按钮位于屏幕中部更稳
设备场景手机横屏
显示表现目录展开两列，正文每行字数增加，图片更宽
操作建议适合翻阅较长的目录与对照内容，双手握持更稳
设备场景平板 7–11 英寸
显示表现卡片两列或三列，左右留白变宽，字号保持不变
操作建议可用食指点击，横竖屏切换后版面自动调整
设备场景桌面浏览器
显示表现满宽多列布局，目录与卡片间距拉开
操作建议可与手机交替使用，浏览位置各自独立互不影响
场景速览
五个最常见的手机访问场景
左右滑动查看，每个场景对应一种手机上的实际查看方式。
竖屏翻目录
一屏一块内容，按顺序往下滑，看到感兴趣的部分再停下细读。
横屏看专题
转动屏幕后目录变两列，一次能看到更多条目，适合集中筛选。
平板大屏
卡片间距拉开，按钮更大更好点，横竖屏切换版面自动跟随。
弱网慢加载
文字与目录先出现，图片随后补上，不必盯着空屏反复刷新。
切回原位置
回消息、切应用之后再回来，页面仍停在刚才浏览的那一段。
常见问题
手机访问常见疑问
集中回答手机上查看时常遇到的几个问题，看完仍有疑问可按页面底部入口继续查找。
先确认浏览器没有开启“桌面版网站”选项，再下拉刷新一次页面。如果仍然显示不全，可以把系统字号调回默认档，或在浏览器设置中清除本站缓存后重新打开。
不需要。页面会按当前设备的屏幕宽度自动排布，换机后直接打开网址即可，之前添加过的桌面快捷方式如果失效，重新添加一次就行。
不会。横屏下正文宽度增加，目录会展开为两列，字号保持与竖屏一致，只是每行可容纳的字数变多，适合翻阅较长的目录和对照内容。
页面会优先呈现文字内容，图片按需加载，稍等片刻即可看到完整版面。如果长时间停留在空白状态，可以切换到信号更稳的网络，或在浏览器中开启省流模式再刷新。