readable.css

readable.css is a CSS framework, but not like the others you’ve seen. Rather than helping you build a sitewide design, readable.css provides a base default that is both sensible and beautiful.

readable.css 是一个 CSS 框架，但它与你见过的其他框架不同。它不是为了帮你构建全站设计，而是提供了一套既合理又美观的基础默认样式。

Out of the box features include: Light and dark mode (manually or via prefers-color-scheme), Responsive design, Vertical rhythm, Headers and footers, Navbar styles, Beautiful images, blockquotes, asides, tables, buttons, and forms, Text justification (off by default), Native font support (serif, sans-serif, or monospace).

开箱即用的功能包括：明暗模式（手动切换或通过 prefers-color-scheme 自动适配）、响应式设计、垂直韵律、页眉和页脚、导航栏样式、美观的图片、引用块、侧边栏、表格、按钮和表单、文本两端对齐（默认关闭）、原生字体支持（衬线体、无衬线体或等宽字体）。

Features you will intentionally not find: Flashy animations, Custom fonts, Utility classes, Anything that overrides your users’ browser settings.

你刻意找不到的功能包括：花哨的动画、自定义字体、工具类（Utility classes）、任何会覆盖用户浏览器设置的内容。

The key design principle of readable.css is consistency. Colors, font-style, border widths, line heights, and everything else are consistent through the entire site.

readable.css 的核心设计原则是“一致性”。颜色、字体样式、边框宽度、行高以及其他所有元素在整个网站中都保持高度统一。

Using readable.css

使用 readable.css

Adding readable.css to your site is remarkably easy. Just download latest version of the CSS file from the releases page and add it to your code: <link rel="stylesheet" type="text/css" href="/path/to/readable.css">

将 readable.css 添加到你的网站非常简单。只需从发布页面下载最新版本的 CSS 文件，并将其添加到你的代码中即可：<link rel="stylesheet" type="text/css" href="/path/to/readable.css">

However, every framework has a learning curve, and readable.css is no exception. readable.css tries to interpret what you want your site to do based on your usage of semantic HTML, but you’ll likely need to learn how to use that semantic HTML properly to take full advantage of this stylesheet. For a guide to using readable.css and writing HTML that works well with it, visit the wiki.

然而，每个框架都有学习曲线，readable.css 也不例外。它会根据你对语义化 HTML 的使用来解读你想要实现的功能，但你可能需要学习如何正确使用这些语义化 HTML，才能充分利用该样式表。如需了解如何使用 readable.css 以及编写与之兼容的 HTML，请访问其 wiki。

Browser Support

浏览器支持

Firefox: 84+
Chromium: 88+
Edge: 88+
Safari: 10+
IE: Not supported
Firefox: 84+
Chromium: 88+
Edge: 88+
Safari: 10+
IE: 不支持

The limiting factor for Chromium, Firefox, and Edge is :not() and :is() support. The limiting factor for Safari is CSS Variable support. IE is not supported, but is also end-of-life as of June 15, 2022.

Chromium、Firefox 和 Edge 的限制因素是对 :not() 和 :is() 的支持。Safari 的限制因素是对 CSS 变量的支持。IE 不受支持，且已于 2022 年 6 月 15 日停止服务。

About Freedom to Write

关于 Freedom to Write

Freedom to Write is a movement dedicated toward creating and supporting Free and Open Source software solutions for the writing industry. We dream of a world where all writers can share their opinions easily and without having to rely on proprietary software.

Freedom to Write 是一个致力于为写作行业创建和支持自由及开源软件解决方案的运动。我们梦想着这样一个世界：所有的作者都能轻松分享他们的观点，而无需依赖专有软件。