扩展:CSS

MediaWiki扩展手册

CSS 发布状态： 稳定版
实现	解析器函数
描述	提供一个用于在文章添加CSS文件、文章或规则的解析器函数。
作者	Aran Dunkley Rusty Burchfield
最新版本	3.5.0 (2017-06-06)
MediaWiki	1.25+
许可协议	GNU通用公眾授權條款2.0或更新版本
下载	下载扩展 Git [?]: 下载Git主线 浏览存储库 (GitHub) 提交历史 repository contributors (GitHub) 代码复核
例子	organicdesign.nz
参数 $wgCSSPath $wgCSSIdentifier
使用的钩子 ParserFirstCallInit RawPageViewBeforeOutput
翻译CSS扩展如果在translatewiki.net可用
检查使用和版本矩阵。
问题	开放的工作 · 报告错误

CSS擴展允許將CSS樣式表載入到特定文章中。CSS樣式表可以是另一個文檔，也可以是直接在解析器函數中定義的規則。

用法

例如，如果你有一個名為「MyStyles.css」的CSS樣式表，它們是用於页面「MyFancyUserPage」的樣式，你可以為後者添加以下解析器函數語法：

{{#css:MyStyles.css}}

再者，如果「MyStyles.css」是位於/wiki/skins目錄之下的文件，那麼路徑應該也被寫進去，如下所示。請注意，檔案路徑必須是帶有文件根目錄斜杠的絕對路徑，以將其與檔名區分開來。

{{#css:/skins/MyStyles.css}}

或者，CSS規則可以直接包含在解析器函數（inline）中，如下例所示：

{{#css:
  body {
    background: yellow;
    font-size: 20pt;
    color: red;
  }
}}

安装

• 下载文件，并将其放置在您extensions/文件夹中的CSS目录内。

• 将下列代码放置在您的LocalSettings.php的底部：

  wfLoadExtension( 'CSS' );
  

• Configure as required.
•  完成 – 在您的wiki上导航至Special:Version，以验证扩展已成功安装。

配置

你可以为扩展文件设置基本URL，可选。

$wgCSSPath = false;  # 默认，与$wgScriptPath有关
$wgCSSPath = '';  # 与服务器根基（root）有关
$wgCSSPath = 'https://example.org/stylesheets';  # 与不同的站点有关

作为页面CSS替代使用

There is a prior Extension:PageCSS (now archived) which used <css> and </css> tags instead of the #css: parser function. This extension can do most of what those extensions provide, but the syntax is incompatible. One way to avoid breaking existing pages which still use the old <css> tags is to use both this Extension:CSS and Extension:NewPageCSS on the same wiki.

An alternate solution (if you want to use only this extension, but have existing content which expects Extension:PageCSS) is to save this stub function as a PHP file and include it from your LocalSettings.php to remap <css> to #css:

<?php

// Stub to remap <css></css> tags to {{#css:}} parser function extension

// For use when installing https://www.mediawiki.org/wiki/Extension:CSS to replace Extension:NewPageCSS on existing wikis

$wgHooks['ParserFirstCallInit'][] = 'wfCSSParserStubInit';
 
// Hook our callback function into the parser
function wfCSSParserStubInit( Parser $parser ) {

        // When the parser sees the <css> tag, it executes the stub wfCSSTagRender function (below) to invoke the {{#css:}} parser
        $parser->setHook( 'css', 'wfCSSTagRender' );
        return true;
}
// Execute <css> tag
function wfCSSTagRender( $input, array $args, Parser $parser, PPFrame $frame ) {

        // Stub function, just redirect the user-provided input text blindly to the {{#css:}} parser function to re-parse it as wikitext
        $output = $parser->recursiveTagParse('{{#css:' . $input . '}}', $frame);
        return $output;
}

At this point, the prior PageCSS (or NewPageCSS) extensions may be removed from your configuration; <css> now goes to #css: and (if you have this CSS extension already up and running) will behave the way any of the other CSS extensions always have.

改变特定页面颜色或背景的问题

使用解析器函数使用另一个页面的CSS不能够用于改变页面的颜色或背景，然而，使用解析器函数在单个页面可以允许页面的背景改变。若要解决这个问题，通过内嵌来加载CSS，就不会导致无法改变页面背景的问题。

To overcome this problem, it is possible to load the CSS through transclusion, which does not cause the problem of failing to load the change to the page background.

漏洞

见讨论页。

参见

• Extension:NewPageCSS
• Extension:TemplateStyles - a similar extension which sanitized the CSS and stores it on separate pages.