模板:Stack mid

File:Test Template Info-Icon - Version (2).svg 模板文件[檢視] [編輯] [歷史] [清除快取]

本模板用來堆疊圖像和其他像信息框之類的浮動內容而不產生間隔和浮動顯示的問題。在第一個參數輸入圖片或模板可以把它們疊放起來，而不會產生間隔或者浮動顯示的錯誤。您可以從章節的頂端疊放許多對象且不用進一步劃分小節留出空白。

用法

最簡單的方式：

{{stack|<objects>}}

另一種方式，使用 {{stack begin}} 和 {{stack end}}：

{{stack begin}}
<objects>
{{stack end}}

<object> 可以是許多圖片或者模板。

可選參數

{{stack| <objects> | float=left/right | clear=true/false}}

或者

{{stack begin | float=left/right | clear=true/false}}

其中

• float= left 或者 right（默認是 right）

  用來決定在左側或右側疊放

• clear= true 或者 false（默認是 false）

  用於強制疊放於側邊

您還可以具體列舉：

{{stack| float=left/right | clear=true/false

|1=<object(s)>

|2=<object(s)>

|3=<object(s)>, 最多 9 個

}}

示例

未使用 {{stack}}

---

=====''Lipsum''=====
[[File:Simple shapes example.png|thumb|right|示例 1a]]
[[File:Simple shapes example.png|thumb|right|示例 1b]]
...文本...

=====''Lorem''=====
[[File:Simple shapes example.png|thumb|left|示例 1c]]
...文本...

=====''Ipsum''=====
...文本...

結果在正下方的範例顯示。注意左側浮動的圖像（示例 1c）被上一個向右浮動的圖片（示例 1b）阻隔。您可能需要調整瀏覽器窗口的寬度來了解問題。為修正這個問題，可以用下列代碼堆疊兩個右側浮動的圖像：

範例:

Lipsum

File:Simple shapes example.png

示例 1a

File:Simple shapes example.png

示例 1b

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem

File:Simple shapes example.png

示例 1c

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

使用 {{stack}}

---

=====''Lipsum''=====
{{stack |[[File:Simple shapes example.png|thumb|right|示例 2a]] [[File:Simple shapes example.png|thumb|right|示例 2b]]}}
...文本...

=====''Lorem''=====
[[File:Simple shapes example.png|thumb|left|示例 2c]]
... 文本 ...

=====''Ipsum''=====
...文本...

結果在正下方的範例顯示。注意使用這類模板以後，左側浮動的圖像（示例 1c）可以在更高的位置浮動顯示，而且不被上一個向右浮動的圖片（示例 1b）阻隔。

範例:

Lipsum

File:Simple shapes example.png

示例 2a

File:Simple shapes example.png

示例 2b

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem

File:Simple shapes example.png

示例 2c

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

使用 {{stack begin}} 和 {{stack end}}

Lipsum 與加寬的第二個表格

表格示例 1
示例 1a
示例 1b

寬表格示例 2
示例 2a
示例 2b

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem

表格示例 3
示例 3a

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lipsum 與加寬的第一個表格

寬表格示例 1
示例 1a
示例 1b

表格示例 2
示例 2a
示例 2b

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem

表格示例 3
示例 3a

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Ipsum

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

Lorem ipsum dolor sit amet, consectetur adipiscing 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.

更多示例

{{Stack}} 可以用來在頁面浮動顯示更多圖片。

File:Simple shapes example.png

File:Simple shapes example.png

{{stack|[[File:Simple shapes example.png|80px]]}}
{{stack|[[File:Simple shapes example.png|120px]]}}

浮動主題首頁框

{{Stack}} 可以用來在其他辦法都不能獲得滿意的效果的情況下把主題首頁框排在信息框或者其他向右對齊的項目旁邊浮動顯示。

信息框 第1行 第2行 第3行 第4行 第5行 第6行 第7行 第8行 第9行

File:Mona Lisa, by Leonardo da Vinci, from C2RMF retouched.jpg

測試圖像

This is a wikitable serving as a typical left-aligned table. The overlap on left-aligned tables had been a frequent problem when other boxes nearby were set to "float:right". So this is a test of how well a floating portal-box would avoid overlapping onto a left-side table.

以下是用 {{stack}} 排版兩個主題首頁框：

{{stack |{{portal|動物}}{{portal|貓}} }}

兩個主題首頁框通過 {{stack}} 的第一個參數堆疊，由於信息框和圖片一起疊放，{{stack}} 把兩個主題首頁框轉移到信息框的旁邊。

堆疊模板系列

• {{Stack}}
• {{Stack begin}}
• {{Stack mid}}
• {{Stack end}}

參見

• {{Multiple image}}，提供多個圖像豎排或橫排布局。
• {{Superimpose}}，將一個圖像排在其他圖像的前面。
• {{Superimpose2}}，將多達50個圖像排在其他圖像的前面。

上述文件嵌入自Template:Stack mid/doc。（編輯 | 歷史）
編者可以在本模板的沙盒（建立 | 鏡像）和測試樣例（建立）頁面進行實驗。
請在/doc子頁面中添加分類。本模板的子頁面。