萌娘百科衷心希望新型冠状病毒肺炎疫情早日结束! | 创建原型类条目前请阅读关于原型类条目收录方针变动的公告
针对音乐条目收录范围的修正案(2021.02.20)正在讨论中,欢迎参与!
  • 你好~!欢迎来到萌娘百科!如果您是第一次来到这里,点这里加入萌娘百科!
  • 欢迎具有翻译能力的同学~有意者请点→Category:需要翻译的条目
  • 如果您在萌娘百科上发现某些内容错误/空缺,请勇于修正/添加!编辑萌娘百科其实很容易!
  • 觉得萌娘百科有趣的话,请推荐给朋友哦~
  • 萌娘百科群119170500欢迎加入,加入时请写明【萌娘百科+自己的ID】~
  • 萌娘百科Discord群组已经建立,请点此加入!

帮助:模板样式表

萌娘百科,万物皆可萌的百科全书!转载请标注来源页面的网页链接,并声明引自萌娘百科。内容不可商用。
跳转至: 导航搜索
Commons-emblem-notice.svg
这个页面“Help:模板样式表”是萌娘百科的帮助文档
  • 本文用于介绍萌娘百科中一些特定功能的操作方法;
  • 本文仅是一篇论述,不属于方针或指引。如果本指南与相关方针或指引发生冲突或存在不一致的情况,请以方针或指引的条文为准。

模板样式表(templatestyles)可以让用户在不需要管理员权限下也能编写适用于条目正文的样式表。关于如何编写样式表,参见MDN文档

用法

创建样式表

首先,用户需要创建一个内容模型为“纯CSS”页面用以存放样式表:

  • 在模板名字空间下创建以.css结尾的页面时,系统会自动将页面的内容模型切换为“纯CSS”;或是
  • 创建页面后打开Special:ChangeContentModel,输入页面名,然后将【新的内容模型】设置为“纯CSS”即可。

恭喜,你已经创建了一个模板样式表!您现在可以在该页面编写CSS文本了。

使用样式表

在需要使用样式表的页面输入<templatestyles src="【样式表页面名】" />即可使用!建议将该标签放在页面最开头,避免网速缓慢用户加载过程中出现样式闪烁的问题。

如果页面名省略了名字空间则会默认使用模板名字空间(与嵌入模板一致)。

目前wrapper参数并不能正确生效。<templatestyles/>还支持wrapper参数用以在所有样式的选择器前额外追加一个选择器,限制生效范围,适合于修改广泛使用的样式表前先复制一份到沙盒样式表中并在沙盒页中做比较用(比如<templatestyles src="Example/styles.css" wrapper="div.example" />将会在所有样式的选择器前追加div.example选择器,使得样式只在<div class="example"/>内生效)。

Lua模块亦能通过frame:extensionTag使用:

local p = {};

function p.templateStyle( frame, src )
   return frame:extensionTag( 'templatestyles', '', { src = src } );
end

return p;

样式表的限制

为了保障网站安全性和确保所有用户都能显示一致的样式,模板样式表扩展对样式表内容有以下限制:
(这些限制由服务器判定,编辑器也会有相关提示,推荐不要使用 Wikiplus 或 In-page Edit 等编辑工具而是使用编辑界面以获得相关提示)

  1. 样式表不得含有错误的格式、无法识别的at-rule、无法识别或不支持的属性或属性值,可以使用的属性和属性值参见扩展源码
  2. 样式表不得含有非标准属性(包括浏览器前缀),参见T162379
  3. 样式表如若需要使用@font-face,则其font-family样式值包含的字体名必须带有TemplateStyles前缀;
  4. (萌百暂不支持)样式表如若需要限定在特定皮肤下生效,则必须在选择器中包含body.skin-vector等皮肤 class,body是必要的
  5. 样式表扩展会在将样式表输出到页面中时对所有样式的选择器追加.mw-parser-output以将样式限制在正文范围内,避免恶意用户篡改其他部分(如编辑按钮等),
    如果需要在正文以外范围使用(如系统消息,例如编辑冲突警告),则需要在相应页面手动用<div class="mw-parser-output">...</div>包裹整个源码。

提供了哪些反滥用工具?

  • 模板样式CSS页面有自己的内容模型(sanitized-css),因此可以使用new_content_model变量使用滥用过滤器跟踪或控制对它们的更改。
  • 模板样式表的跟踪方式与普通的模板相同,因此您可以通过“链入页面”选项查看样式表的使用位置,查看“页面信息”下页面上使用的样式表(可能在编辑屏幕上, 取决于您使用的编辑器),并使用“相关更改”查看最近可能影响页面的更改。
  • 模板样式还在HTML代码中保留标识信息。要查找特定规则的来源,请查看页面源代码,寻找带有data-mw-deduplicate属性的的<style/>标签,其中data-mw-deduplicate的值形如TemplateStyles:r123456",而123456是样式表的修订版ID(可以用Special:Diff查看)。