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

幫助:模板樣式表

萌娘百科,萬物皆可萌的百科全書!轉載請標註來源頁面的網頁連結,並聲明引自萌娘百科。內容不可商用。
跳至導覽 跳至搜尋
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 = "【样式表页面名】" } );
end

return p;

測試樣式表

你可以在Help:沙盒/styles.css中添加樣式,並在Help:沙盒中引入<templatestyles src="Help:沙盒/styles.css" />和需要測試的內容。建議對大量嵌入的樣式表做出更改之前先進行測試。

樣式表的限制

為了保障網站安全性和確保所有用戶都能顯示一致的樣式,模板樣式表擴展對樣式表內容有以下限制:
(這些限制由服務器判定,編輯器也會有相關提示,推薦不要使用 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查看)。