div col​​分幾欄或者整細啲字

概要

編輯

{{div col [ |content= 內容 ] [ | 其他參數 ] }}

{{div col [ | 其他參數 ] }}
內容
{{div col end}}

參數同用法

編輯

呢個模有兩種用法:簡單情況下可以直接畀 content 參數,唔使用 「div col end」 模;正常情況用呢個模設定分欄模式,唔畀 content 參數,模後面寫內容,然後用 「div col end」 模結束分欄模式。

模會喺生成嘅 HTML 加 「div-col」 同 「columns」 兩個 class;如果有指定濶度會再加 「column-width」,冇嘅話再加 「column-count-欄數」。

其他參數

編輯
  • 參數一,或者 cols=欄數​分幾多欄,預設分兩欄
  • 參數二,或者 colwidth=濶度​每欄幾濶(CSS 格式,要寫埋單位)
  • small=yes​整細啲字(正常大細 90%)
  • style=格式代碼​直接畀 CSS,人手設定格式

另外有其他參數似乎唔可以正常運作,任何其他格式建議用 style 參數直接取代

範例

編輯

下面最底有啲例用到 10em,咁窄係純粹為個示範易睇,正常唔會用咁窄。

唔分欄,齋整細啲字

編輯
  • 打:{{div col |1 |small=yes| content={{Lorem ipsum}}}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  • 打:{{div col |1 |small=yes}}
    {{Lorem ipsum}}
    {{div col end}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

唔畀分欄參數

編輯
  • 打:{{div col |content={{Lorem ipsum}}}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  • 打:{{div col}}
    {{Lorem ipsum}}
    {{div col end}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

分三欄

編輯
  • 打:{{div col|3}}
    {{Lorem ipsum}}
    {{div col end}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

同時指定分三欄同每欄 10 正方

編輯
  • 打:{{div col|3|10em}}
    {{Lorem ipsum}}
    {{div col end}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

指定每欄 10 正方

編輯
  • 打:{{div col||10em}}
    {{Lorem ipsum}}
    {{div col end}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

人手指定 CSS

編輯
  • 打:{{div col|style=columns:10em}}
    {{Lorem ipsum}}
    {{div col end}}
  • 出:
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

睇埋

編輯