模板:Div col/doc
跳至導覽
跳至搜尋
本模板用於將一段內容分為數段,你也可以通過設置參數|small=
來獲得更小的字體,設置參數|rules=
來設置列與列間的分隔線,以及通過參數|style=
來自定義其他css屬性。
適用版本
屬性 | Internet Explorer | Firefox | Safari | Chrome | Opera |
---|---|---|---|---|---|
column-width column-count |
≥ 10 (2012) |
≥ 1.5 (2005) |
≥ 3 (2007) |
≥ 1 (2008) |
≥ 11.1 (2011) |
columns | ≥ 10 (2012) |
≥ 9 (2011) |
≥ 3 (2007) |
≥ 1 (2008) |
≥ 11.1 (2011) |
參數
主要使用的參數有:
或者第一個未命名參數。確定內容被劃分的最佳列數,默認值為2(這個參數是根據換行符號來判斷的,只有內容為多行才能發揮作用,如果為單行則不劃分,並且有可能使內容超出屏幕並消失,故需謹慎)。|cols=
- 不建議使用這個參數,因為下面的參數 colwidth 在不同解像度的顯示屏上表現更好
|colwidth=
或者第二個未命名參數。規定每列的最小寬度,並基於此自動劃分列數。在解像度越大的顯示屏上,顯示的列數越多。其會覆蓋掉參數 cols 的作用。適用於任何css單位,比如em。|rules=
在列之間添加分隔線,你也可以自定義分隔線的屬性,比如1px dashed blue;
(記得帶半角分號)。|gap=
設置相鄰兩列間的列間距,同樣適用於任何css單位,默認值為1em。|style=
增加其他的CSS屬性(同樣,記得用半角分號分隔屬性)。|content=
你想分列的內容。|small=
輸入yes時,會縮小其中的字體。
例子
1.不使用參數
{{Div col|content= * a * b * c * d * e * f * g * h}}
會被自動分為兩列。
- a
- b
- c
- d
- e
- f
- g
- h
2.使用命名參數(推薦)
{{Div col|colwidth=10em|rules=yes|gap=2em|small=yes|content= * a * b * c * d * e * f * g * h}}
以及
{{Div col|rules=3px dashed blue;|gap=3em|small=|colwidth=10em|content= * a * b * c * d * e * f * g * h}}
結果為
- a
- b
- c
- d
- e
- f
- g
- h
和
- a
- b
- c
- d
- e
- f
- g
- h
3.使用非命名參數
{{div col|3||content= * a * b * c * d * e * f * g * h}}
結果為
- a
- b
- c
- d
- e
- f
- g
- h
4.混用參數
{{div col||10em|rules=yes|gap=2em|content= * a * b * c * d * e * f * g * h}}
結果為
- a
- b
- c
- d
- e
- f
- g
- h
需要注意的是,命名參數不能用非命名參數的形式使用,否則會失效或出錯。