旁注指导

旁注指导

如果您在使用电脑，请将鼠标移到本段文字上。

WOOOO！我是旁注

本页面解释了如何在您的页面中使用旁注代码

旁注有几类不同形式。一类只有文字，一类只有代码，还有一类两者兼有。

只有文字

[[include component:sidenote
contents=标题|
figure=内容
]]

只有图片

[[include component:sidenote
figure=标题|
name=图片链接|
type=image
]]

两者兼有

[[include component:sidenote
contents=旁注|
figure=标题|
name=图片链接|
type=both
]]

使用上述代码时
用你要在旁注里写的东西替换“旁注”
用你希望旁注的标题替换“标题”
用图片链接替换“图片链接”

值得注意的是，当你在页面添加旁注时，预览页面时其会显示错误。但如果你代码没错，那么保存页面之后，旁注就正确显示了。

此外，你可以客制化旁注，使之居中或居左对齐。

居中对齐

[[include component:sidenote
contents=旁注|
figure=标题|
align=center
]]

居左对齐

[[include component:sidenote
contents=旁注|
figure=标题|
align=left
]]

哇！我居中了

酷！

哦这里有一张图片！

{$contents}

---

如果你想让图像在旁注底部现实，你可以使用：

image-location=bottom

这只对于 type=both，即图像文字两者兼有的旁注类型有效

默认图片的位置

二三四五

在底部图片的位置

六七八九

---

如果出于某种奇怪的原因，你想让旁注始终显示，你可以这么做：

显示锁定

[[include component:sidenote
contents=旁注|
figure=标题|
lock=true
]]

用以在版式和页面上修改旁注样式的代码：

:root {
--sidenote-open-background: #1c2431;
--sidenote-closed-background: var(--content-bar-background);
--sidenote-box-shadow: var(--content-box-shadow);
--sidenote-background: var(--primary-background);
--sidenote-contents-border: 1px dashed #333;
--sidenote-figure-border: 1px solid #333;
--sidenote-contents-open-color: var(--text-color);
--sidenote-figure-open-color: var(--text-color);
--sidenote-contents-closed-color: var(--text-color);
--sidenote-figure-closed-color: var(--text-color);
}