說明:階層式樣式表
 | 此條目可參照英語維基百科相應條目來擴充。 |
階層式樣式表允許靈活地設定頁面的格式。對於非表格內容，應儘可能使用它們而不是表格，因為如果你是像模板一樣將CSS嵌入在裡面，他們就可以被讀者直接使用或者方便他人的修改。
CSS設定的層級
[編輯]風格樣式（Style）一般是可以專門為一個部分、段落、內容進行的，又或者是用元素、類和ID為CSS選擇器指定樣式。這是在各個不同層面上完成的
一般情況下根據下列規範來編寫樣式表：
注意：請參閱CSS類目錄(英文)以取得所有已載入樣式表的列表。
MediaWiki的核心樣式表
[編輯]請參見階層式樣式表 ，通常情況下載入如下樣式表：
特定介面的樣式檔案：
[編輯]例如： monobook/main.css (通常用於電腦上), chick/main.css (通常用於行動裝置)
瀏覽器介面的專用樣式：
[編輯]例如在桌面端：
全站通用的樣式檔案
[編輯]- 針對於桌面端的樣式：MediaWiki:Common.css
- 針對於行動端的樣式：MediaWiki:Mobile.css
- 針對於特定的單獨樣式：Vector，Monobook等
- 針對於使用者群組的樣式：註冊使用者，自動確認使用者等
- 針對於特殊用途的樣式：列印頁面，無Script頁面，檔案頁面等
- 針對於載入小工具的樣式：小工具樣式（請跳轉此條目頁面以取得更多資訊）
注意：非英語的MediaWiki網站可能會使用「MediaWiki: Gadget-site.css」來代替「MediaWiki: Common.css」檔案
特定頁面的樣式檔案
[編輯]通過模板樣式來使用特定頁面的樣式檔案，很多模板一般都會使用行內的樣式表
使用者頁面的樣式檔案
[編輯]- 使用者頁面的全域樣式檔案: meta:Special:MyPage/global.css
- 使用者頁面的樣式檔案: Special:MyPage/common.css
- 使用者頁面的專用樣式檔案（適用於你當前頁面的）: Vector or Special:MyPage/skin.css
- 通過JaveScript載入的使用者頁面樣式檔案：Special:MyPage/common.js
- 通過瀏覽器設定或載入本地檔案的使用者指定樣式
注意：在CSS規範中 使用者指定樣式不屬於使用者樣式表
衝突處理
[編輯]如果不同的樣式檔案在使用過程中存在衝突，則要根據權重來判斷哪個樣式檔案更為重要，一般情況下使用者的權重會大於作者的權重，當然還可以使用「!important」來做出聲明， 如果使用者和作者均「!important」則以使用者為準，否則採用其預設設定（或者說編者的預設設定），除了權重還有起源和特異性的對比來判斷不同樣式檔案的重要程度，特定的權重勢必大於通用的權重（看這個樣式是針對整個頁面、特定模組、特定段落或者是更小的元素，權重依次遞增），具體的資訊可以檢視[1]。
支援的元素
[編輯]MediaWiki支援大多數CSS，但 "url（）"等屬性除外。另外在早期版本中，CSS 支援存在一些錯誤。
維基文字中的CSS
[編輯]您可以在代碼的HTML元素中使用CSS樣式（參見HTML以取得MediaWiki支援的元素列表），就像在普通HTML標記中一樣。
例如，一個帶有綠色邊框的<div>...</div>元素，其內容浮動到右側，我們就可以用以下方式來實現
<div style="float:right; border:thin solid green;">
Here comes a short paragraph that is</br>
contained in a "div" element that is</br>
floated to the right.
</div>
這是一個包含
在右側浮動的「div」元素
中的簡短段落。
這將產生右側的盒子。
一些維基文字元素允許您直接在其中插入CSS樣式。
一個例子是表語法：
{| style="your style here"
|-
|your table stuff
|}
MediaWiki中存在的樣式
[編輯]你可能想要使用在維基中預定義的樣式，當然你也可以為你的使用者頁面建立專屬的樣式，Vector是預設的樣式，你也可以建立一個類來放置你的樣式
技巧與提示
[編輯]不顯示
[編輯]可以根據裝置頁面與使用方法的不同，同時存在多個頁面代碼，在不同的頁面上顯示不同的風格樣式，例如：
.''classname'' {display: none}
#''id'' {display: none}
一般情況下，未顯示的連結不起作用。
它不能用於刪除模板名稱、參數名稱、參數值、連結中的頁面名稱等表達式中的文字。
如果想要檢視隱藏文字，可以使用Web開發人員工具列，然後選擇顯示該工具列中的隱藏元素。它將顯示所有隱藏的元素。
不列印
[編輯]可以通過聲明內容屬於「noprint」類來排除列印內容：
<div class="someclass noprint">This will not appear in the print version.</div>
參考
[編輯]- 塊與行
- CSS – 關於CSS的詞條
- 個性化設定(英文) – 包括使用者名稱、偏好設定設定、外觀、使用者指令碼等。
- 說明:使用者樣式 – 修改樣式以進行可訪問性或其他功能測試。
- 模板樣式 – 修改樣式以獲得可以與模板一起應用的進階視覺外觀。
- CSS的類目錄(英文) – 在整個站點中全域定義的類列表
- 維基專案：微格式/類(英文) – 維基百科微格式中使用的類列表
- 等寬字型的CSS樣式模板(英文) – 既用於編輯窗口，也用於顯示等寬元素，如
<code> - MediaWiki：CSS (手冊) 和 MediaWiki：階層式樣式表（手冊）
- MediaWiki：使用者樣式庫
- Meta：Explaining skins
- MediaWiki：Skin projects