More actions
No edit summary |
No edit summary |
||
(25 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
<includeonly> | <includeonly><ul class="template gallery" {{#if:{{{perrow|}}}|style="width:{{#expr:({{#rmatch:{{{width|150px}}}|(\d+)|$1}}+10)*{{{perrow}}}}}px"}}> | ||
<ul class="template gallery" {{#if:{{{perrow|}}}|style="width:{{#expr:({{#rmatch:{{{width|150px}}}|(\d+)|$1}}+10)*{{{perrow}}}}}px"}}> | |||
{{#if:{{{caption|}}}|<li class="gallerycaption">{{{caption}}}</li>}} | {{#if:{{{caption|}}}|<li class="gallerycaption">{{{caption}}}</li>}} | ||
{{#forargs:|k|v|{{#rmatch:{{#var:k}}|^\d+$|{{#ifeq:{{#expr:{{#var:k}} mod 2}}|1|<li class="gallerybox"><div class="thumb">[[{{#var:v}}]]</div><div class="gallerytext"><p>|{{#var:v}}</p></div></li>}}}}}} | {{#forargs:|k|v|{{#rmatch:{{#var:k}}|^\d+$|{{#ifeq:{{#expr:{{#var:k}} mod 2}}|1|<li class="gallerybox"><div class="thumb" style="width:{{{width|150px}}};height:{{{height|150px}}};">[[{{#var:v}}]]</div><div class="gallerytext"><p>|{{#var:v}}</p></div></li>}}}}}} | ||
</ul> | </ul>{{#if:{{#varexists:gallery}}||{{#vardefineecho:gallery | ||
{{#if:{{#varexists:gallery}} | |||
| | |||
|{{#vardefineecho:gallery | |||
|{{#css: | |{{#css: | ||
ul.gallery.template{ | ul.gallery.template{ | ||
Line 18: | Line 14: | ||
} | } | ||
ul.gallery.template li.gallerybox div.thumb{ | ul.gallery.template li.gallerybox div.thumb{ | ||
border:1px solid #c8ccd1; | border:1px solid #c8ccd1; | ||
background-color:#f8f9fa; | background-color:#f8f9fa; | ||
Line 26: | Line 19: | ||
justify-content:center; | justify-content:center; | ||
align-items:center;margin:4px; | align-items:center;margin:4px; | ||
overflow-y:hidden; | |||
} | } | ||
ul.gallery.template li.gallerybox div.thumb img{ | ul.gallery.template li.gallerybox div.thumb span a img{ | ||
width: | width: 100%; | ||
object-fit:contain;margin:0 auto; | object-fit:contain;margin:0 auto; | ||
} | } | ||
Line 35: | Line 28: | ||
overflow:hidden;font-size:94%;padding:2px 4px;word-wrap:break-word;text-align:center; | overflow:hidden;font-size:94%;padding:2px 4px;word-wrap:break-word;text-align:center; | ||
} | } | ||
}}}}}} | }}}}}}</includeonly> | ||
</includeonly> | |||
<noinclude> | <noinclude> | ||
<!-- 简述模板作用 --> | <!-- 简述模板作用 --> | ||
Line 64: | Line 52: | ||
<!-- 选填参数项的说明,如没有可以留空或删除 --> | <!-- 选填参数项的说明,如没有可以留空或删除 --> | ||
*caption:gallery的标题 | *caption:gallery的标题 | ||
* | *width:宽(单位:px)设置宽高时建议按照图片尺寸比例设置 | ||
* | *height:高(单位:px)设置宽高时建议按照图片尺寸比例设置 | ||
*perrow:每行显示数量 | *perrow:每行显示数量 | ||
*title:图片提示文字 | *title:图片提示文字 | ||
==示例1== | |||
<!-- 模板使用示例 --> | |||
===你所写的=== | |||
<pre>{{gallery | |||
|file:Main MPI3508.jpg|文字描述 | |||
|file:4.0-HDMI-004.jpg|可以指向[[首页]] | |||
|file:4.0-HDMI-004.jpg| | |||
}}</pre> | |||
===显示内容=== | |||
{{gallery | |||
|file:Main MPI3508.jpg|文字描述 | |||
|file:4.0-HDMI-004.jpg|可以指向[[首页]] | |||
|file:4.0-HDMI-004.jpg| | |||
}} | |||
==示例2== | ==示例2== | ||
<!-- 模板使用示例 --> | <!-- 模板使用示例 --> | ||
===你所写的=== | ===你所写的=== | ||
<pre>{{gallery|caption=标题|width= | <pre>{{gallery|caption=标题|width=200px|height=200px|perrow=2 | ||
|file:Main MPI3508.jpg|文字描述 | |file:Main MPI3508.jpg|文字描述 | ||
|file:4.0-HDMI-004.jpg|可以指向[[首页]] | |file:4.0-HDMI-004.jpg|可以指向[[首页]] | ||
Line 79: | Line 81: | ||
}}</pre> | }}</pre> | ||
===显示内容=== | ===显示内容=== | ||
{{gallery|caption=标题|width=200px|height= | {{gallery|caption=标题|width=200px|height=200px|perrow=2 | ||
|file:Main MPI3508.jpg|文字描述 | |file:Main MPI3508.jpg|文字描述 | ||
|file:4.0-HDMI-004.jpg|可以指向[[首页]] | |file:4.0-HDMI-004.jpg|可以指向[[首页]] | ||
|file:4.0-HDMI-004.jpg| | |file:4.0-HDMI-004.jpg| | ||
}} | }} | ||
</noinclude> | </noinclude> |
Latest revision as of 20:34, 1 August 2024
标签 <gallery> 的替代品,支持gif动图
使用方法
调用参数
{{gallery|caption=<caption>|width=<width>|height=<height>|perrow=<perrow> |file1|title1 |file2|title2 … |fileN|titleN }}
必填
- file:图片名
选填
- caption:gallery的标题
- width:宽(单位:px)设置宽高时建议按照图片尺寸比例设置
- height:高(单位:px)设置宽高时建议按照图片尺寸比例设置
- perrow:每行显示数量
- title:图片提示文字
示例1
你所写的
{{gallery |file:Main MPI3508.jpg|文字描述 |file:4.0-HDMI-004.jpg|可以指向[[首页]] |file:4.0-HDMI-004.jpg| }}
显示内容
文字描述
可以指向首页
示例2
你所写的
{{gallery|caption=标题|width=200px|height=200px|perrow=2 |file:Main MPI3508.jpg|文字描述 |file:4.0-HDMI-004.jpg|可以指向[[首页]] |file:4.0-HDMI-004.jpg| }}
显示内容
- 标题
文字描述
可以指向首页