說明:顯示代碼文本
代碼文本(Code text)通常會以某種方式格式化,以便從視覺上將其與普通的文本區分開來。在泰拉瑞亞 Wiki中,有很多方式能將代碼文本格式化,它們被列在下方。
HTML 標籤
標準的 HTML <code></code>
標籤,最常被用於顯示代碼文本。文本會以等寬字體顯示,並用淡化的邊框加以表示。這主要用於顯示單行文本、以及普通文本中的代碼。而 <pre></pre>
標籤則可以用於顯示跨行的代碼文本。使用該標籤時,會顯示出一個單獨的文本框,並占據更多的空間。<code>
會識別並正常顯示出 Wiki 代碼的語法,而 <pre>
則會將其完全忽略。第三種方法是使用 <div class="mw-code"></code>
,它模仿了 <pre></pre>
的外觀,但仍然會保留 Wiki 代碼。此時,最好避免人為的換行,換行應當使用 <br/>
標籤,以避免與空格、換行及間距相關的一系列問題出現。
保留 Wiki 代碼 | 多行 | |
---|---|---|
<code>
|
✔️ | ❌ |
<pre>
|
❌ | ✔️ |
class="mw-code"
|
✔️ | ✔️ |
範例
代碼 | 結果 |
---|---|
This is <code>code text</code> |
This is code text
|
Over <code>multiple<br/>lines</code> |
Over multiple
|
Over <code>multiple lines</code> |
Over multiple
|
<code>{{desktop}}</code> |
电脑版
|
代碼 | 結果 |
---|---|
This is <pre>code text</pre> |
This is code text |
Over <pre>multiple<br/>lines</pre> |
Over multiple<br/>lines |
Over <pre>multiple lines</pre> |
Over multiple lines |
<pre>{{desktop}}</pre> |
{{desktop}} |
代碼 | 結果 |
---|---|
This is <div class="mw-code">code text</div> |
This is code text
|
Over <div class="mw-code">multiple<br/>lines</div> |
Over multiple
lines |
Over <div class="mw-code">multiple lines</div> |
Over multiple
lines
|
<div class="mw-code">Many manual linebreaks cause weird spacing issues</div> |
Many
manual linebreaks cause weird spacing issues |
<div class="mw-code">It's better<br/>to use<br/><!-- -->HTML tags<br/><!-- -->for linebreaks</div> |
It's better
to use HTML tags for linebreaks |
<div class="mw-code">{{desktop}}</div> |
擴展標籤
MediaWiki 的代碼高亮(SyntaxHighlight)擴展提供了 <syntaxhighlight></syntaxhighlight>
標籤,它在格式化代碼的基礎上,又增加了根據相應程式語言的種類高亮文本的功能。<source></source>
標籤與其意思相同,但該標籤已經過時了,不應當繼續使用(參見使用過時標籤的頁面列表以獲取仍在使用該標籤的頁面列表)。與 <pre>
類似,它會忽略所有的維基語法。
此標籤可以接受若干種參數,參見相應的文檔以便獲取其使用細節和示例。其語法高亮功能支持的完整的程式語言列表,可以在 Pygments 文檔中找到;在 「Short names」 下列出的每種語言,都可以用作該標籤的 lang
參數。例如,如要高亮使用 C# 語法寫成的代碼,那麼可以使用的值包括 csharp
、c#
和 cs
。
本 Wiki 的 CSS、JavaScript 和 Lua 頁面會自動使用 <syntaxhighlight>
標籤(例如MediaWiki:Gadget-previewTab.css、MediaWiki:Common.js 或 Module:Bananas頁面)。如果頁面太長(如MediaWiki:Common.css頁面),那麼會放棄使用語法高亮,而會改為使用默認的文本格式)。
範例
代碼 | 結果 |
---|---|
The CSS rule is <syntaxhighlight lang="css" inline>background-color:#fff;</syntaxhighlight>. |
The CSS rule is background-color:#fff; .
|
<syntaxhighlight lang="text" inline>{{desktop}}</syntaxhighlight> |
{{desktop}}
|
JavaScript excerpt: <syntaxhighlight lang="js" line linelinks="jsexcerpt1" start="71" highlight="2,6-7"> /** * Handle wide tables */ $(function() { var handleWideTables = function(tables) { if(!tables){ return; } } } </syntaxhighlight> |
JavaScript 片段: |
<syntaxhighlight lang="text">Over multiple lines</syntaxhighlight> |
Over multiple
lines
|
模板
模板 {{code}}
也會將代碼文本格式化。它也受其他模板的使用限制的約束,例如,|
或 =
之類的字符必須要進行轉義(escape)。它的優勢在於,{{code|text}}
的速度要比 <code>text</code>
略快,但由於它使用起來比較麻煩、有些反直覺,因此通常使用的是後者。
它在內部使用了 <syntaxhighlight>
標籤,因此也支持使用它的部分參數。
範例
代碼 | 結果 |
---|---|
This is {{code|code text}} |
This is
|
Not over {{code|multiple<br/>lines}} |
Not over
|
Not over {{code|multiple lines}} |
Not over
|
{{code|{{desktop}}}} |
|
{{code|{{=}} or {{)}} need escaping; not with = HTML entities}} |
|
The CSS rule is {{code|lang=css|background-color:#fff;}}. |
The CSS rule is .
|