文本格式
文本就是普通 HTML,主题直接为元素本身设置样式:写出语义化标记,效果就已经正确。无需类名,也无需内联样式。
粗体和斜体
<strong>bold text</strong> and <em>italic text</em> and <strong><em>bold italic</em></strong>
**bold text** and *italic text* and ***bold italic***
渲染为:粗体文本、斜体文本和 粗斜体
删除线
<s>deleted text</s>
~~deleted text~~
渲染为:已删除的文本
行内代码
Use <code>const x = 1</code> for inline code.
渲染为:使用 const x = 1 表示行内代码。
<kbd> 标记按键:按 Ctrl + C 复制。
行内代码高亮
带有 language-* 类的行内
<code> 会像代码块一样高亮,使用相同的浅色和深色主题。
Run <code class="language-js">await build("docs")</code> first.
Run `await build("docs"){:js}` first.
渲染为:先运行 await build("docs")。
引用块
<blockquote><p>This is a blockquote.</p></blockquote>
> This is a blockquote.
渲染为:
这是一个引用块。
列表
无序列表和有序列表:
- 第一项
-
第二项
- 嵌套项
- 第一步
- 第二步
- 第三步
<ul>
<li>First item</li>
<li>Second item<ul><li>Nested item</li></ul></li>
</ul>
<ol><li>Step one</li><li>Step two</li></ol>
- First item
- Second item
- Nested item
1. Step one
2. Step two
任务列表
以禁用复选框开头的列表项:
<ul>
<li><input type="checkbox" checked disabled> Completed task</li>
<li><input type="checkbox" disabled> Pending task</li>
</ul>
- [x] Completed task
- [ ] Pending task
渲染为:
- 已完成的任务
- 待办任务
水平分隔线
<hr>
---
脚注
无需组件。脚注引用是一个 <sup> 链接,指向带有相应 ID 的
<li>;悬停或聚焦该引用时会预览脚注内容,但不含返回链接。没有脚本时,链接仍会跳转到脚注。
Here is a sentence with a footnote<sup><a href="#note-1" id="ref-1">1</a></sup>.
<ol>
<li id="note-1">This is a numbered footnote. <a href="#ref-1">↩</a></li>
</ol>
渲染为:
定义列表
为术语给出描述:
<dl>
<dt>Page</dt>
<dd>An .html file in a project</dd>
<dt>Escape</dt>
<dd>A project file that replaces a built-in asset</dd>
<dd>Kept under .htmlpress/</dd>
</dl>
Page
: An .html file in a project
Escape
: A project file that replaces a built-in asset
: Kept under .htmlpress/
渲染为:
- 页面
- 项目中的一个
.html文件 - 弹出文件
- 替换内置资源的项目文件
- 存放在
.htmlpress/下
缩写
无需组件。<abbr title>
在悬停或聚焦时显示其完整形式;没有脚本时,title 仍作为浏览器原生的工具提示。
The <abbr title="HyperText Markup Language">HTML</abbr> standard is maintained by <abbr title="World Wide Web Consortium">W3C</abbr>.
渲染为:HTML 标准由 W3C 维护。
Emoji
直接书写 emoji 字符;页面使用 UTF-8 编码:
🚀 Launch 🎉 Celebrate ❤️ Love ⚠️ Careful ✅ Done
渲染为:🚀 发布 🎉 庆祝 ❤️ 喜爱 ⚠️ 小心 ✅ 完成
GitHub 的短代码会在构建时变成 emoji;未知的短代码,以及代码或
data-literal 元素中的任何内容,都保持原样:
Ship it :rocket: :tada:
Ship it :rocket: :tada:
渲染为:发布吧 🚀 🎉
用 ❤ 和 Htmlpress 构建