置顶公告:【置顶】关于临时开启评论区所有功能的公告(2022.10.22) | 【置顶】关于本站Widget恢复使用的公告
  • 你好~!欢迎来到萌娘百科镜像站!如需查看或编辑,请联系本站管理员注册账号。
  • 本镜像站和其他萌娘百科的镜像站无关,请注意分别。

幫助:代碼高亮工具

萌娘百科,萬物皆可萌的百科全書!轉載請標註來源頁面的網頁連結,並聲明引自萌娘百科。內容不可商用。
跳至導覽 跳至搜尋
Circle-icons-tools-light blue.svg
這個頁面「Help:代碼高亮工具」是萌娘百科的小工具說明文檔

Code prettify是一個基於JavaScript開發的頁面顯示工具,可以對頁面上的代碼進行高亮。您可以在參數設置中勾選「代碼高亮工具DM 閱讀時高亮顯示頁面上的代碼塊。」啟用此工具。

此工具基於Google Code Prettify寫成,源地址:https://github.com/googlearchive/code-prettify

可用語言列表

自動高亮語言

本工具支持下表左列語言的高亮和自動檢測,探測到對應語言的代碼塊時會自動進行高亮。

語言支持情況
受支持的語言 對應可用名稱
TypeScript ts
typescript
JavaScript js
javascript
JSON json
CSS css
HTML htm
html
Lua scribunto
lua
PHP php
Regex regex
LaTeX latex
tex

手動高亮語言

本工具支持code-prettify默認支持的其他語言高亮,但不會自動檢測語言,需要手動指定語言:

  • C系列語言:c, cc, cpp, cxx, cyc, cs
  • Java
  • Python
  • Bash
  • SQL
  • Perl
  • XML
  • Ruby
  • Makefile
  • Rust
  • 正則表達式

不在上表的語言也可能能被高亮,但效果不作保證。

使用方法

讀者側

您只需要到參數設置中勾選「代碼高亮工具DM 閱讀時高亮顯示頁面上的代碼塊。」啟用本工具即可。

編輯側

您可以通過以下幾種方式編寫可被本工具自動檢測語言並高亮的代碼塊:

  1. JS、CSS頁面等頁面內容模型為#自動高亮語言表中左側語言之一的頁面;
  2. <pre><code>標籤里填寫lang屬性,值需為#自動高亮語言表中右側名稱之一,不分大小寫:
    • {{pre}}支持<pre>的語言指定,具體參見模板文檔。

您可以通過以下方式編寫可被本工具高亮的代碼塊,但須手動指定語言:

  1. <pre><code>標籤里填寫class屬性,值需為prettyprint lang-【语言名】,語言名要麼為MediaWiki:Gadget-code-prettify-core.js#L681-L739所定義的語言名,要麼為該語言的通用名或文件擴展名,不分大小寫。

通過上述第2、3種方法進行高亮的<pre>元素可在標籤里填寫data-start屬性,值需為正整數,指定代碼第一行的行號,若不指定則默認為1。