代码指导

本页面的大部分内容摘取自 Wikidot 语法页面，以便于阅读。

Table of Contents

任何站点的任何页面都以两种不同的形式存在——源代码和编译代码。源代码是你可以编辑的和描述页面内容的内容。源代码被编译成（XHTML）代码，当你查看/浏览页面时发送到浏览器。Wikidot语法用于通过编辑源代码来创建页面内容。Wikidot很大程度地保留了原本的HTML代码使用方法并具有小幅调整，主要方括号的FTML轻量级语言为主，同时还添加了诸多原创内容并简化了如a元素p元素meta元素等复杂繁琐的HTML语法，但最大的缺点是wikidot不怎么支持JS，这意味着你的版式和文章将缺少现代网页布局的艺术感，但wikidot终究是功大于过。

div与span

[[div]]
这是一个div。
[[/div]]

在 span 元素后添加下划线 [[span_ ]] 会去除其周围的空白字符，这样可以防止自动生成新的换行和段落。这有助于构建如 Bootstrap 组件等复杂的 HTML 语法结构。

你可以在 … 标签中使用自定义的 ID 参数，这在基于 Bootstrap 构建网站时极其有用。请注意，每个用户自定义的 ID 在输出的 HTML 中都会自动加上 "u-" 前缀，这是出于安全考虑。

为了使源代码更具可读性，你可以自行添加 "u-" 前缀。例如，以下两段 Wiki 语法将输出相同的 HTML：

[[span id="mySpan"]]我的span元素[[/span]]

"u-"前缀将不会被添加，因为它已经存在。

[[span id="u-mySpan"]]我的span元素[[/span]]

以上两个示例最终生成的 HTML 输出均为：
<span id="u-mySpan">我的 span 元素</span>

换行与段落

段落之间通过两个换行符分隔。仅使用一个换行符只会产生一个换行效果。

第一段。 Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

第二段。 Aenean a libero. Vestibulum adipiscing, felis ac faucibus imperdiet, erat lacus accumsan neque, vitae nonummy lorem pede ac elit.
只是换了一行。

第一段。 Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

第二段。 Aenean a libero. Vestibulum adipiscing, felis ac faucibus imperdiet, erat lacus accumsan neque, vitae nonummy lorem pede ac elit.
又换了一行。

换行符：

有一种特殊的字符可用于在行尾实现换行但不开始新段落，这在表格或 div 等布局中非常有用，有时是必需的：
它由一个空格、一个 下划线（然后按回车）组成，用于在代码中插入这样的换行符，使文本从下一行开始显示。

这种差异不太容易展示出来（因为空格加回车在代码块中也几乎会被渲染成一行）：

最后一行（后面有 5 次回车）

使用 5 次特殊换行符：
_
_
_
_

请注意：单独的空格或空行最终都会被渲染成一行！

文本样式

行内样式

语法	示例
//斜体文本//	斜体文本
粗体文本	粗体文本
//斜体与粗体//	斜体与粗体
__下划线文本__	下划线文本
--删除线文本--	删除线文本
{{打字机（等宽字）文本}}	`打字机（等宽字）文本`
普通^^上标^^	普通^上标
普通,,下标,,	普通_下标
[[span style="color: red;"]]自定义 //span// 元素[[/span]]	自定义 span 元素
##blue\|预定义## 或 ##44FF88\|自定义代码## 颜色	预定义或自定义代码颜色

文本大小

文本（字体）大小可以使用 [[size …]]…[[/size]] 标签来设置。这些标签可以嵌套使用。

相对文本大小是基于当前字体大小的——它们会使当前字体变大或变小。要指定相对文本大小，可以使用、、[[size nem]] 或 [[size n%]]，其中 n 是一个 1 到 5 位的数字（可以包含可选的小数点）。

格式	示例
[[size smaller]]更小的文本[[/size]]	[[size smaller]]更小的文本[[/size]]
[[size larger]]更大的文本[[/size]]	[[size larger]]更大的文本[[/size]]
[[size 80%]]现大小的 80%[[/size]]	[[size 80%]]现大小的 80%[[/size]]
[[size 100%]]现大小的 100%[[/size]]	[[size 100%]]现大小的 100%[[/size]]
[[size 150%]]现大小的 150%[[/size]]	[[size 150%]]现大小的 150%[[/size]]
[[size 0.8em]]现大小的 80%[[/size]]	[[size 0.8em]]现大小的 80%[[/size]]
[[size 1em]]现大小的 100%[[/size]]	[[size 1em]]现大小的 100%[[/size]]
[[size 1.5em]]现大小的 150%[[/size]]	[[size 1.5em]]现大小的 150%[[/size]]
[[size xx-small]]超超小文本[[/size]]	[[size xx-small]]超超小文本[[/size]]
[[size x-small]]超小文本[[/size]]	[[size x-small]]超小文本[[/size]]
[[size small]]小文本[[/size]]	[[size small]]小文本[[/size]]
[[size large]]大文本[[/size]]	[[size large]]大文本[[/size]]
[[size x-large]]超大文本[[/size]]	[[size x-large]]超大文本[[/size]]
[[size xx-large]]超超大文本[[/size]]	[[size xx-large]]超超大文本[[/size]]
[[size 7px]]文本大小 7 像素[[/size]]	[[size 7px]]文本大小 7 像素
[[size 18.75px]]文本大小 18.75 像素[[/size]]	[[size 18.75px]]文本大小 18.75 像素

以“x”为单位的记数

转义解析/原始文本

在文本两侧同行不带空格地包裹上两个 @ 符号即可转义解析并渲染出原始文本，也就是可以精准显示出你在 @ 符号之间放的文本。这一点在显示出被用作 Wikidot 语法样式的符号，或者展示如何自定义文本（就像这个指导一样）时非常好用。

语法	示例
@@//转义//解析@@	//转义//解析

这也可以用作转义解析换行符并阻止 Wikidot 将空行折叠到一起，只需在一行内放下四个 @ 符号即可。

这个代码：

哇真是个大
@@@@
@@@@
@@@@
缺口！

会变成这个文本：

哇真是个大

缺口！

另一种转义解析的方法就是在文本两侧放上 @< 和 >@。这是一种更加高级的方法，他能转义相当多不可输入的字符，替代了部分日文排版，且同时可被用于插入 HTML 字符。

这个代码：

会变成这个文本：

Hello world @@ !!!!
[[module ListPages]]
版权所有符号：©

这是唯一一个转义 @@ 的方法，因为用两个 @ 符号的方法来转义 @ 符号并不会起作用。

链接

三个方括号 [[[ ]]] 将可创建一个连接至你正位于的维基上的链接。这是创建链接的推荐语法。

语法	示例	注释
[[[overview:entities]]]	entities	展示与其创建时完全相同的页面名称。
[[[overview:entities\|文本]]]	文本	在你想要显示不同于页面名称的文本时非常好用。
[[[level-blht-5]]]	level-blht-5	跟第一个示例一样，只是用了带横杠的页面名称。
[[[Level BLHT-5]]]	Level BLHT-5	这里用了页面标题来创建链接。
http://www.wikidot.com	http://www.wikidot.com	网址会自动变成链接。
[http://www.wikidot.com wikidot]	wikidot	一个有命名的链接，显示了自定义的文本。

在网址前方式一个星号 * 就可以让链接在新标签页中打开。

*http://www.wikidot.com
[http://www.wikidot.com wikidot]

http://www.wikidot.com
wikidot

很不幸这种方法并不能在页面链接（三括号标记）里使用。如果你想让一个页面链接在新标签页中打开，那么你就需要用到页面的网址，而不仅是页面标题。

注意：一个页面的标题和页面的名称是两个不一样的东西，虽然他们通常很相似以防混淆。

页面的标题指显示在页面顶部的文本。这也就是你在编辑一个页面时在“页面标题”里键入的文本。
页面的名称就是在网址的第一个斜杠后面的文本，也就是网址里在 backrooms-wiki-cn.wikidot.com/ 后面的文本。

使用一些个链接可以代替点击按钮时的编辑模式，让你更快速的编辑。
例如：
[http://site-name.wikidot.com/page-name/title/biaoti]
biaoti通过修改可以直接修改你打开编辑模式后的标题，不需要点开修改。

图片

这是图片的代码。推荐你使用这个代码。
{name}（名称） - 你图片的名称。应该包含有文件的扩展名，比如 “.jpg”、“.png” 等等。如果该图片并未上传到维基页面之中，那就应该是末尾带有图片扩展名的一条网址。
{caption}（说明文字） - 图片的说明文字。这里的文本可以用 Wikidot 语法来自定义。

Level 0 里所摄下的第一幅照片。

[[include :backrooms-wiki-cn:component:image-block
|name=Level_0.png
|caption=**Level 0** 里所摄下的第一幅照片。
]]

该组件亦有更多可供自定义的属性。
{width}（宽度）- 图片的宽度，高度会随着这个宽度一同改变，亦即改变图片宽度时宽高比永远不会改变。默认宽度为 300px。
{link}（链接）- 为图片附加上跳转链接。默认不跳转，即填写 “#”。
{align}（平齐）- 图片框对齐的位置。left 代表向左对齐，right 代表向右对齐，center 代表居中。默认为 right，

若需使用默认的 Wikidot 图片样式，那么可使用以下代码。注意如果你使用这条代码那么将不会有说明文字区域。
{图片来源} - 图片的来源，大概相当于维基的图片标记里的 name（名称）。
{属性} - 附加于图片上的属性，用于修改比如大小、css 样式之类的东西，或者让图片链接到某个网址上。

[[image 图片来源 属性 1="值 1" 属性 2="值 2" ……]]

更多有关如何使用 Wikidot 的图片标记语言的信息，比如可用的属性，可以在 Wikidot 的图片标记文档里找到。

创建节段

标题

标题可以从 1 级（H1）到 6 级（H6）。按照你的喜好给每一级标题多加一个加号 +。标题字体大小会随着级数的增加而减小。

+ 1 级标题
++ 2 级标题
+++ 3 级标题
++++ 4 级标题
+++++ 5 级标题
++++++ 6 级标题

内容列表

代码 [[toc]] 能够创建一个内容列表table of contents，或者说 TOC。这个 TOC 会显示页面上的所有标题。
若需使 TOC 在页面右侧浮动，则使用 [[f>toc]]
若需使 TOC 在页面左侧浮动，则使用 [[f<toc]]

如果你不想要某个特定的标题在 TOC 里显示（比如你用标题样式只是为了外观装饰），那么可以在标题的 + 后放上一个星号 *。

+ 这一节段会在 TOC 里显示
+* 而这一节段则不会

参见该页面的顶部以查看 TOC 的外观。

列表

你可以用星号 * 创建一个无序列表，且可以用井号创建 # 一个有序列表。在星号或井号前加上空格就可以缩进列表。
无序列表和有序列表可以混用。

* 无序列表
 * 这一行缩进了一次
  * 这一行缩进了两次
# 有序列表
 # 这一行缩进了一次
  # 这一行缩进了两次
* 另一个无序列表
 # 里面一层是有序列表
  * 再里面一层又是无序列表
  * 无序列表的另一项
 # 有序列表的另一项

无序列表
- 这一行缩进了一次
  - 这一行缩进了两次

有序列表
1. 这一行缩进了一次
  1. 这一行缩进了两次

另一个无序列表
1. 里面一层是有序列表
  - 再里面一层又是无序列表
  - 无序列表的另一项
2. 有序列表的另一项

同时wikidot保留了原生的HTML代码——

[[ul]]
 [[li class="item1" data-toggle="data1"]]Item1[[/li]]
 [[li style="color: red;"]]Item 2
  [[ol]]
    [[li]]Item 2.1[[/li]]
    [[li]]Item 2.2[[/li]]
  [[/ol]]
 [[/li]]
[[/ul]]

Item1
Item 2
1. Item 2.1
2. Item 2.2

引用块

在一行文本前放上一个 > 可以将文本放在引用块内部。你可以增加 > 符号的数量来缩进文本。

> 这是一个引用块。
>> 这是一个带缩进的引用块。
> 更多的文本
>
> 这一行文本上面有一行空行！
> 如果你想在引用块里放空行的话，要记得在 “>” 符号后面放一个空格！

这是一个引用块。

这是一个带缩进的引用块。

更多的文本
这一行文本上面有一行空行！
如果你想在引用块里放空行的话，要记得在 “>” 符号后面放一个空格！

自定义 Div

除 Wikidot 自带的样式之外，后室维基的版式还有数个自定义 div 样式。

[[div class="blockquote"]]
自定义引用块
[[/div]]
[[div class="styled-quote"]]
样式化引用块
[[/div]]
[[div class="dark-styled-quote"]]
暗色样式化引用块
[[/div]]
[[div class="lightblock"]]
亮色块
[[/div]]
[[div class="darkblock"]]
暗色块
[[/div]]

自定义引用块

样式化引用块

暗色样式化引用块

亮色块

暗色块

折叠块

折叠块可以被打开或收起来展开或隐藏文本。

[[collapsible show="+ 展开随便什么" hide="- 收起随便什么"]]
要展开/收起的随便什么文本。
[[/collapsible]]

+ 展开随便什么

如果你有一个特别长的折叠块，你可能会想要让它像在顶端一样可以在文本底部收起折叠。

[[collapsible show="+ 展开随便什么" hide="- 收起随便什么" hideLocation="both"]]
这个折叠块可以同时从顶部与底部收起！
[[/collapsible]]

+ 展开随便什么

表格

表格使用两条竖杠 || 来指定单元格边界的位置。在竖杠的右边放一个波浪号（~ 符号）就可以让那个单元格变为标题单元格。在单元格内一行的末尾放上一个空格和一个下划线 “ _” 就能创建一个新行，使你可以在一个单元格内放下多行文本。

||~ 一行必须以 ||~ 双竖杠开始 ||~ 并以其结尾 ||
|| 单元格要被 || 双竖杠分割 || 什么都没有 ||
|||| 你可以使用 || 多个分隔符 ||
|| 使得单元格 |||| 能跨越多列 ||
|||||| 但要看示例 _
才是最简单 ||

一行必须以	双竖杠开始	并以其结尾
单元格要被	双竖杠分割	什么都没有
你可以使用		多个分隔符
使得单元格	能跨越多列
但要看示例才是最简单

以上的表格适合写文，但不适合做一些个好玩的代码，不妨看看下面的？

第一	第二	第三
第四		第五
第六	第七	第八
第六	懒得数了	第十

这些可以通过行内样式修改，也可以用F12查找代码。

脚注

[[footnote]] 块会在页面的末尾放上一个页面列表。使用 [[footnoteblock]] 可以将脚注列表放在页面里随便一个你喜欢的地方，而不是在页面的底部。

一些文本[[footnote]]以及一个小小的脚注。[[/footnote]]。我们再来另一个脚注[[footnote]]另一个脚注的内容。[[/footnote]]。

[[footnoteblock]]

一些文本¹。我们再来另一个脚注²。

你可以用[[footnoteblock title="自定义标题"]] 来给脚注列表创建一个自定义标题。用 {title=""} 来移除标题。

分页

内容可以被分成多个标签页。这在有着多个草稿的沙盒页里特别有用。分页不能直接分别嵌套。可以用高级代码来这么干，但是最好不要嵌套分页。分页也不对页面内容生效，因为 TOC 链接并不能正确链接到标签页的标题内部。

[[tabview]]
[[tab 标签页标题 1 号]]
标签页内容 1 号。
[[/tab]]
[[tab 标签页标题 2 号]]
标签页内容 2 号。
[[/tab]]
[[tab 标签页标题 3 号]]
标签页内容 3 号。
[[/tab]]
[[/tabview]]

标签页内容 1 号。

杂项

四个或以上的横杠 ---- 可以做出一条分割线，就像下面的一样：

若需链接至 Wikidot 用户的资料页，可使用 [[user 用户名]] 或者 [[*user 用户名]].

语法	示例	注释
[[user deleting]]	deleting	不会显示用户的个人头像或者业力等级。
[[*user deleting]]	deleting	可以显示用户的个人头像以及业力等级。

若需像如上一般显示代码（有着某些限制），可以使用以下代码：

[[code]]
在此插入代码
[[/code]]

上面的代码将会如下显示：

在此插入代码

code元素有一个可选的值，那就是type，当type等于HTML的时候，可以存储HTML代码，目前该值有以下可选择——C++、CSS、PHP、HTML&XHTML、Diff、Java、JavaScript、Perl、Python、Ruby、SQL和XML。

code元素还可以起到代码引用的功能，当

[[code type="CSS"]]
。
[[/code]]

的时候，写进去的代码将存储在一个叫做/code/1的地方，而后你可以输入http://your-site-name.wikidot.com/component:theme/code/1进入外部主题，这样就无需template模板即可使用版式。

排版工作组

本站提前引用了排版工作组，你无需再次引用。

时间显示

[[date timestamp <format="format<|agohover>">]]
这是一个正确的时间显示范例，<…>表示可选参数
timestamp是1970年1月1日到所需日期之间的秒数。
Format是一个可以包含%修饰符的任意文本字符串，这些修饰符将被实际（部分）日期或时间替换。如果未指定，format默认为“%e ”。
|agohover当指定时，当鼠标移动到显示格式字符串的任何部分时，显示“悬停”文本（“多少秒/分钟/小时/天年”）。

以下为可选择输入的修饰符。

你写的	他的解释	例子
`%a`	星期几的缩写（3个字母），比如 Mon, Tue	09 Mar 2009 12:04
`%A`	星期几的完整名称，比如 Monday, Tuesday	09 Mar 2009 12:04
`%b`	月份的缩写（3个字母），比如 Jan, Feb	09 Mar 2009 12:04
`%B`	月份的完整名称，比如 January, February	09 Mar 2009 12:04
`%c`	本地日期时间的默认格式表示	09 Mar 2009 12:04
`%d`	这个月的第几天（两位数，01 到 31）	09 Mar 2009 12:04
`%D`	相当于 %m/%d/%y，也就是月/日/年（年份后两位）	09 Mar 2009 12:04
`%e`	这个月的第几天（19 不补零，1031，比如 1, 9, 10, 31）	09 Mar 2009 12:04
`%H`	小时（24小时制，两位数，00 到 23）	09 Mar 2009 12:04
`%I`	小时（12小时制，两位数，00 到 12）	09 Mar 2009 12:04
`%m`	月份（两位数，01 到 12）	09 Mar 2009 12:04
`%M`	分钟（两位数，00 到 59）	09 Mar 2009 12:04
`%O`	显示相对时间，比如 nn 秒/分钟/小时/天	09 Mar 2009 12:04
`%p`	AM 或 PM（上午/下午）	09 Mar 2009 12:04
`%r`	相当于 %I:%M:%S %p，也就是 12小时制时间 + AM/PM	09 Mar 2009 12:04
`%R`	相当于 %H:%M，也就是 24小时制的时间（小时:分钟）	09 Mar 2009 12:04
`%S`	秒数（两位数，00 到 59）	09 Mar 2009 12:04
`%T`	相当于 %H:%M:%S，也就是 24小时制时间（时:分:秒）	09 Mar 2009 12:04
`%y`	年份后两位（00 到 99），比如 24 表示 2024 年	09 Mar 2009 12:04
`%Y`	完整年份（4位数，比如 2024，范围 1970 到 2999）	09 Mar 2009 12:04
`%z _ %Z`	时区信息，比如 UTC、CST 等	09 Mar 2009 12:04

指导管理

页面版本: 10, 最后编辑于: 23 Nov 2025 05:21

编辑评分 (+1) 标签讨论 (0) 历史记录附件打印网站工具 + 选项

探寻雾霾

雾霾的世界，雾霾笼罩世界