← 全部文章

教程

舒适的网页阅读——现成的 JustZix 示例

许多你主要用来阅读的网站,其设计照顾的是除阅读之外的一切:过宽的栏目、过小的字体、一条条相关内容。JustZix 目录如今有了能把它们变成舒适阅读模式的合集。下面是一个概览。

阅读是一项排版任务

舒适的文字需要有上限的行长、得体的行高,以及大小合适的字体。大多数网站都做不到这些。几条 CSS 规则可以一次性修正所有这些参数——而且对该网站的每一篇文章都生效。

覆盖了哪些网站

目录为 Wikipedia、Medium、BBC、Goodreads、Hacker News 和 Stack Overflow 都准备了专门的合集——每个合集约有 45 个示例。

这些规则能做什么

常见的调整:舒适的正文栏宽、更大更易读的字体、更宽裕的行高、深色和棕褐色阅读模式、隐藏相关内容栏和“最多阅读”栏、隐藏横幅和提示、一个只显示文章的专注模式,以及一条阅读进度条。

示例:舒适的栏宽

/* Wikipedia:舒适的阅读栏宽 */
.mw-parser-output {
  max-width: 720px !important;
  margin: 0 auto !important;
}

Medium、BBC 和其他合集有它们自己的宽度和排版规则,与各自的结构相匹配。

如何开始

打开示例目录,挑选一个网站并复制规则。安装 JustZix,舒适地阅读。

为这篇文章评分

暂无评分 — 成为第一个。

自己动手试试

安装 JustZix,粘贴本文中的任意代码片段。两分钟,从零到一条在你所有设备上生效的规则。

获取 JustZix

功能 · 工作原理 · 示例 · 应用场景