惊涛拍岸 · 阅读示例
本篇用于集中展示惊涛拍岸主题下的各类 Markdown 样式,便于对照调整。
一、多级标题
正文之前,先确认标题层级在深蓝底、灯塔光下的层次感。
三级标题示例
小节标题应清晰可辨,与正文拉开层级。
四级标题
再往下的层级用于内文分点。
五级标题
较少使用,但样式需一致。
六级标题
最小标题层级。
二、段落与强调
这是一段普通正文。惊涛拍岸主题下,主文字为深蓝灰,行高适中,便于长文阅读。可包含 粗体、斜体、行内代码 以及 小字说明。
第二段用于测试段间距与两端对齐效果。若有多段连续出现,应保持视觉上的呼吸感,不显拥挤。
三、列表
无序列表
- 灯塔在夜海中指引方向
- 惊涛拍岸,浪花与礁石
- 冷蓝与暖光形成对比
有序列表
- 首先确定阅读宽度与背景
- 其次设定主色与强调色
- 最后微调标题与代码块
嵌套列表
- 外层项
- 内层无序
- 再一层
- 另一外层
- 内层有序第一
- 内层有序第二
四、引用块
惊涛拍岸,卷起千堆雪。灯塔之光,在黑暗中为航船指明归途。
—— 主题意象
五、提示块(Admonition)
note
这是一条 Note 提示。惊涛拍岸主题下,提示块应有左侧色条与浅底,与正文区分。
tip
这是一条 Tip 提示。可用于操作建议、小技巧等,风格与 note 一致、色相可略作区分。
warning
警告类提示,用于需要特别注意的内容。
六、代码
行内可写 const x = 1 或 theme--jingtao。
代码块示例(语法高亮若未配置则仅为等宽背景):
function lighthouse() {
const beam = "warm";
return { light: beam, waves: "cold" };
}
lighthouse();
.theme--jingtao .jingtao-reading h1 {
color: var(--jingtao-ink-strong);
border-bottom: 2px solid rgba(37, 99, 168, 0.35);
}
七、表格
| 元素 | 说明 |
|---|---|
| 背景 | 惊涛拍岸.png 固定铺满 |
| 主色 | 深蓝、海蓝、灯塔暖黄 |
| 正文区 | 半透明白底 / 雾面玻璃感 |
| 按钮 | PDF / Demo / 代码包 |
| 主题 | 场景 | 风格 |
|---|---|---|
| 茶香氤氲 | 苹果论 | 茶色纸感 |
| 惊涛拍岸 | 思想与光 | 夜海灯塔 |
| 南屏晚风 | 目录页 | 晚风明月 |
八、分隔线与收尾
以上为惊涛拍岸主题的样式预览。若某类元素需要微调,可直接在 阅读样式—惊涛拍岸.css 中修改对应选择器。
感谢阅读。