在手机上使用知乎 PC 桌面版(功能完整、可登录、可发帖评论),把版面压成一列铺满屏幕,字号和点击区按手机尺寸放大。
适用于 Android 上支持浏览器扩展的浏览器(Firefox for Android / Kiwi / Vivaldi 等),配合 ScriptCat、Tampermonkey 安装。
iOS 不支持浏览器扩展,用不了这个方案。
解决什么问题
手机浏览器切「桌面版网站」后,知乎按 1000px 的固定宽度排版,再被缩到 420px 左右的屏幕上:
|
原样 |
装脚本后 |
| 正文 |
15px 缩成约 6px,看不清 |
16px 观感,正常阅读 |
| 布局 |
主列 694px + 右侧栏 296px 一起缩 |
单列铺满屏幕 |
| 右侧栏 |
占着屏幕四成宽度 |
隐藏 |
| 列表 |
白底连成一片,条目间只有一条细线 |
浅灰底 + 独立白卡,间隔 8px |
| 顶栏 |
导航挤成一排,字小到看不清 |
两行:导航 + 搜索框(带头像) |
| 操作条 |
按钮字小、行矮,点不准 |
字号 15px、点击区 36–44px |
| 头像 / 作者名 |
24px 头像、13px 名字 |
36px 头像、15px 加粗名字 |
功能
版面
- 把知乎的布局宽度令牌(
--container-width、--app-width)改成屏幕宽,桌面版的多栏自动塌成单列。
- 隐藏右侧栏(问题页、首页、个人页、话题页)。
- 列表卡片化:页面铺浅灰底,每条内容独立成白卡(圆角 10px、间距 8px),卡片内嵌的知乎自带问答卡撤掉边框,避免双层。
- 宽图、表格、代码块不撑破页面;表格和代码块自己横向滚动。
- 顶栏去掉知乎 logo,改两行:第一行导航 + 消息/私信,第二行搜索框 + 头像。
字号
桌面模式下浏览器常把页面按 980px 渲染再整体缩小,页面里所有 px 都会缩到六成以下。脚本:
- 强制写入
viewport,把视口拉回设备实宽;
- 浏览器不认这个 meta 时,按
clientWidth / screen.width 算出补偿系数 --zh-k,字号、行高、内边距、头像、点击区全部同比放大。
所以无论浏览器缩放行为如何,屏幕上看到的都是 16px 正文。
单独放大的部分:
- 正文 / 评论 16px,行高 1.7,标题 18px 加粗
- 操作条(赞同 / 评论 / 收藏 / 喜欢 / 分享)字号 15px、整行最小高 44px、按钮最小高 36px
- 头像 36px,作者名 15px 加粗
- 时间、IP 等元信息 13–14px
- 头像下拉菜单条目 14px、行高 40px
顶栏
- 消息 / 私信去掉图标,只显示文字和数字:
消息(80)、私信(62)。
- 顶栏里的原生搜索框连外层「直答」按钮一起隐藏,换成页面顶部一条自绘搜索框,回车跳到知乎内容搜索结果页。
- 导航只保留前 5 个(关注 / 推荐 / 热榜 / 专栏 / 圈子),后面的推广热词隐藏。
阅读体验
- 首页顶部的「分享想法 / 提问题 / 写回答 / 写文章 / 发视频」创作入口隐藏。
- 摘要不再按固定高度裁行,长回答直接展开。
- 操作条按钮变多时,「收起」常驻右侧,其余按钮在左侧横向滑动,不用滑到底才能收起。
安装
- 浏览器安装 ScriptCat(脚本猫) 扩展;Tampermonkey 也可以。
- 在本页点「安装脚本」。
- 在浏览器菜单里打开「桌面版网站 / 请求桌面站点」,再访问 zhihu.com。
第 3 步是必须的:脚本不改 User-Agent,知乎返回桌面版 HTML 是靠浏览器这一步。如果浏览器还在移动版模式,脚本检测不到桌面版页面结构,会什么也不做。
已知限制
- 只在竖屏生效。横屏时知乎自己的桌面布局本来就放得下,脚本不动。
- 论坛式搜索建议没有了。自绘搜索框没有联想下拉,回车直接进搜索结果页。
- 顶栏需下拉才看到导航。第二行搜索框高度由脚本测量后告诉正文,测量发生在首帧,个别情况下会差几个像素。
- 依赖知乎的类名与 CSS 变量。知乎改版后可能失效,主要依赖:
- CSS 变量
--container-width / --app-width / --container-padding-x
- 结构类
.AppHeader、.Topstory-container、.Topstory-mainColumn、.Question-mainColumn、.ContentItem-actions、.WriteArea、.RichContent-inner、.AppHeaderProfileMenu-item
- 顶栏头像靠
header.AppHeader > div > div:last-child 定位
- 消息/私信靠 SVG 类名
BellFill / ChatBubble 识别
- 不修改 User-Agent,不绕过登录、不做任何数据抓取。
可调参数
脚本内几处常量,按需要改后重新保存即可:
| 位置 |
作用 |
tick() 里的 --zh-k 计算 |
缩放补偿上限(默认封顶 4 倍) |
trimNav() 的 i >= 5 |
顶栏保留的导航项数量 |
pinCollapse() 的 COLLAPSE_RE |
「收起」按钮的识别正则,默认 /^收起\S{0,4}$/ |
#zh-search 的样式 |
搜索框字号、圆角、留白 |
更新日志
0.3.6
首发版本。布局塌陷成单列、隐藏右侧栏、列表卡片化、字号与点击区按缩放系数放大、顶栏两行(导航 + 搜索框 + 头像)、消息/私信文字化、摘要展开、「收起」常驻右侧。
参考来源
早期版本的布局骨架参考了 kkocdko 的 Zhihu Desktop on Mobile(Unlicense),包括顶栏横向滚动、操作条收窄、弹窗宽度、隐藏 App 推广条这几处选择器。
当前版本的布局宽度令牌方案、缩放补偿系数、卡片化列表、顶栏两行改造、自绘搜索条、消息/私信文字化均为独立实现。
许可
MIT