模板:Gallerygrid/doc

生成一个使用CSS3 Grid布局的画廊，用于取代传统的<gallery>写法。

参数

编号参数
- 输入文件名和注释文本。编号本身可以省略。
- 每个编号参数对应一个图片及其注释。所有参数需要在一个字符串中书写。
- 字符串应当以文件全称开头（file:或文件:）。文件名称结束后，使用双英文冒号::分隔。该符号后的部分将被视为该图片的注释。
- 字符串中不得包含英文等号。如果有包含等号的需求，请在该参数前声明编号，如|1=file:xxxx.jpg::我=是一张=图是正确的写法，而|file:xxxx.jpg::我=是一张=图会导致该图片无法识别。
- 字符串中不得包含pipe符号（|）。
template
- 需要用于输出画廊元素的子模板。见下文“二次开发”一节。默认值为default。
widths
- 图片的宽度。每个画廊中图片的宽度是统一的。默认值为240px。
heights
- 图片的高度。每个画廊中图片的高度是统一的。默认值为120px。
thumbsize
- 图片缩略图的宽度。默认值与widths相等。
- 在默认输出模板中，图片将按照上述参数规定的widths和heights画出的容器显示，因此大于widths的缩略图实际上将无谓消耗带宽。
gap
- 控制网格的间隙。该参数会造成图片实际宽度比widths稍小。
fit
- 由于widths和heights参数限制死了图片显示区域的尺寸，fit参数用于控制图片的实际内容在显示区域的适应方式。
- cover：默认值。使图片其中一个方向填满区域，另一个方向居中显示（并裁切掉超出显示区域的部分）。
- contain：使图片保持比例显示在区域中心，超出比例的区域留空。

示例

默认参数

{{gallerygrid
|widths=180px
|File:Tetris_collection_Simon_Laroche.jpg::我是一段注释文本。
|File:Tetris_collection_Simon_Laroche.jpg::现在，你可以前往 MediaWiki 网站学习维基编写知识：
*[https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Contents MediWiki 帮助]
|File:Tetris_collection_Simon_Laroche.jpg::我是一段注释文本。
|File:Tetris_collection_Simon_Laroche.jpg::我是一段注释文本。
|File:Tetris_collection_Simon_Laroche.jpg::[[Template:Randomtips|自己动手，丰衣足食]]
|File:Tetris_collection_Simon_Laroche.jpg::*如果你会编写CSS，我们欢迎你加入[[Project:关于]]编辑群协助我们改善网站外观。我们需要你这样的人才。
|File:Tetris_collection_Simon_Laroche.jpg::*'''注意'''：俄罗斯方块中文维基是一个独立站点，与其他中外文wiki站点不存在任何隶属关系。
|File:Tetris_collection_Simon_Laroche.jpg::这些图片由 Tetris Wiki 活跃编辑者 [https://tetris.wiki/User:Simonlc simonlc]提供。
}}

我是一段注释文本。

现在，你可以前往 MediaWiki 网站学习维基编写知识：

MediWiki 帮助

我是一段注释文本。

自己动手，丰衣足食

如果你会编写CSS，我们欢迎你加入Project:关于编辑群协助我们改善网站外观。我们需要你这样的人才。

注意：俄罗斯方块中文维基是一个独立站点，与其他中外文wiki站点不存在任何隶属关系。

这些图片由 Tetris Wiki 活跃编辑者 simonlc提供。

全参数

{{gallerygrid
|widths=160px
|heights=160px
|thumbsize=160px
|gap=8px
|File:Tetris_collection_Simon_Laroche.jpg::我是一段注释文本。
|File:Tetris_collection_Simon_Laroche.jpg::现在，你可以前往 MediaWiki 网站学习维基编写知识：
*[https://www.mediawiki.org/wiki/Special:MyLanguage/Help:Contents MediWiki 帮助]
|File:Tetris_collection_Simon_Laroche.jpg::我是一段注释文本。
|File:Tetris_collection_Simon_Laroche.jpg::我是一段注释文本。
|File:Tetris_collection_Simon_Laroche.jpg::[[Template:Randomtips|自己动手，丰衣足食]]
|File:Tetris_collection_Simon_Laroche.jpg::*如果你会编写CSS，我们欢迎你加入[[Project:关于]]编辑群协助我们改善网站外观。我们需要你这样的人才。
|File:Tetris_collection_Simon_Laroche.jpg::*'''注意'''：俄罗斯方块中文维基是一个独立站点，与其他中外文wiki站点不存在任何隶属关系。
|File:Tetris_collection_Simon_Laroche.jpg::这些图片由 Tetris Wiki 活跃编辑者 [https://tetris.wiki/User:Simonlc simonlc]提供。
}}

我是一段注释文本。

现在，你可以前往 MediaWiki 网站学习维基编写知识：

MediWiki 帮助

我是一段注释文本。

自己动手，丰衣足食

如果你会编写CSS，我们欢迎你加入Project:关于编辑群协助我们改善网站外观。我们需要你这样的人才。

注意：俄罗斯方块中文维基是一个独立站点，与其他中外文wiki站点不存在任何隶属关系。

这些图片由 Tetris Wiki 活跃编辑者 simonlc提供。

fit参数

本节展示的是fit参数不同时图片的显示规律。

fit参数不填或为cover时，图片将保持比例填满可显示区域：

{{gallerygrid
|widths=200px
|heights=200px
|fit=cover
|文件:Galleryplaceholder.jpg::fit参数为cover。图片的左右实际上被裁切了一部分。
}}

fit参数为cover。

fit参数为contain时，图片将全部展示在显示区域内（并对不符合比例的区域留白）：

{{gallerygrid
|widths=200px
|heights=200px
|fit=contain
|文件:Galleryplaceholder.jpg::fit参数为contain。如果你在F12里选择图片，会发现图片上下出现了留白。
}}

fit参数为contain。

二次开发

使用新的输出模板

template参数指定了所需加载的模板。默认值default代表图像元素将通过模板:gallerygrid/default进行输出。你可以复制该模板到另一个模板子页面并在此基础上进行开发。

更改样式

两个基础样式位于gadget:gallerygrid.css中。新增或修改的样式建议统一放在该文件中。

修改该文件可能需要相关权限。