模板:連結圖組/doc
跳至導覽
跳至搜尋
簡介
該模板可以生成一組連結圖片組，一般用於大家族模板（條目下方導航模板）。
為照顧靈活性，該模板只會生成數個<li>，其中每個<li>都包含一個角色圖片以及該角色的連結，外部需要手動包裹一組<ul>標籤作為容器。
用法
該模板有兩種使用方法。
單獨圖片
雖然不是強制規定，但請儘可能保證所有圖片規格一致。
具體請參考#示例四。
雪碧圖
這個模板只能作用於以下格式的雪碧圖：
- 雪碧圖中的小圖片按角色橫向排列。
- 所有小圖片大小均勻，小圖片與小圖片之間間距相等
- 若有點擊進入角色頁面要變化的圖片，要置於同一角色下方，垂直於一條直線。
| 樣例 |
|---|
|
若有其他格式的雪碧圖或應用情形，請單獨使用{{image}}模板或{{sprites}}模板。
參數
開啟註釋
{{連結圖組
|image= <!-- 雪碧圖文件，只支持內鏈 -->
|charas=<!-- 要使用到的所有角色名，中間用全形逗號【，】隔開，若想規定圖片下方連結顯示的文字，請使用：頁面名=顯示名 的寫法。 -->
|start=<!-- 起始位置，默認為1 -->
|size=<!-- 圖片大小，固定單位為px，請填寫數字，以下多個參數均是這樣 -->
|width=<!-- 小圖片寬度，格式同上 -->
|height<!-- 小圖片高度 -->
|fitWidth=<!-- 調節寬度，所有小圖片容器本身的大小會加上該值，用於圖片規格不均或小圖片間距沒有完全相等時使用，該參數不受縮放的影響 -->
|fitHeight=<!-- 調節高度，同上 -->
|offsetX=<!-- 雪碧圖小圖片的橫向偏移，可以理解為小圖片之間的間距 -->
|offsetY=<!-- 雪碧圖小圖片的縱向偏移，無切換圖片就不要填 -->
|scale=<!-- 對所有小圖片進行縮放，默認為1（也就是不縮放），絕大多數情況下都要縮放 -->
|targetSize=<!-- 將所有小圖片縮放到指定的大小，默認為width參數的大小（也就是不縮放），該值的縮放會被scale參數的縮放所覆蓋 -->
|radius=<!-- 對小圖片四角進行裁剪，在雪碧圖背景非透明時使用 -->
|blockStyle=<!-- 對每個小圖片+對應連結塊的樣式，默認為margin:0 5px -->
|imgContainerStyle=<!- 圖片外層div容器樣式，默認樣式為：display:inline-block; width:對應參數值; height:對應參數值; position:relative;，若沒有特殊要求，請不要覆蓋這些值 --->
|class= 為每個小圖片的最外層容器添加class，一般用於添加hover過渡效果
|角色名|角色名|角色名...<!-- 此處規定角色的排列位置，默認按雪碧圖中角色的從左到右排列，若無需調換位置請不要填寫，角色名使用charas參數中的顯示名 -->
|add1=<!-- 向大家族末尾添加一組新的角色圖片+連結，一般在使用雪碧圖需要追加新角色時使用 -->
|add2=
|add3=
...
}}
關閉註釋
{{链接图组
|image=
|charas=
|start=
|size=
|width=
|height
|fitWidth=
|fitHeight=
|offsetX=
|offsetY=
|scale=
|targetSize=
|radius=
|blockStyle=
|imgContainerStyle=
|class=
}}
- 其中：【角色名...】以及【add...】中的語法都為【圖片文件（若無圖片可以用「@space」代替生成一個空白），頁面名，顯示名】。
- 圖片文件只支持內鏈，若頁面名和顯示名相同，則不需要再填顯示名。
- 顯示名中可以為連結添加樣式，如：
古宫乃乃香={{color|pink|古宫乃乃香}}(使用雪碧圖時，參見#示例二)、xxx.jpg，古宫乃乃香，{{color|pink|古宫乃乃香}}(使用單獨圖片時，參見#示例五)
- 以上參數若有不使用的請刪除，否則可能導致出現錯誤。
示例
示例一~三均為雪碧圖的用法。
示例一
<ul>{{链接图组
|image= Nav-ikamusume.png
|charas= 乌贼娘(侵略！乌贼娘)=乌贼娘，相泽荣子，相泽千鹤，齐藤渚
|start= 1
|size= 2400
|width= 157.5
|height= 188
|offsetX= 30
|offsetY= 17
|scale= 0.5
}}</ul>
示例二
可按照需要調整角色圖片順序：
<ul>{{链接图组
|image= Nav-天体的秩序.png
|charas= 古宫乃乃香，诺艾尔(天体的秩序)=诺艾尔，椎原小春，水坂柚季，水坂凑太，户川汐音
|size= 2600
|width= 332
|height= 332
|offsetX= 30
|targetSize= 90
|blockStyle= margin:0 7px;
|诺艾尔|古宫乃乃香|水坂柚季|@space，怪兽先生|户川汐音}}</ul>
示例三
最先的雪碧圖：
後加的角色圖片：
{{hovers}}
<ul>{{链接图组
|image= Nav-干物妹.png
|charas= 土间埋，海老名菜菜，本场切绘，橘·希尔芬福特
|size= 1900
|width= 200
|height= 200
|offsetX= 10
|scale= 0.5
|blockStyle= margin:0 10px;
|class= hovers-grow-shallow
|add1=Kongou Hikari Icon.png，金刚光
}}</ul>
示例四
這是該模板使用單獨圖片時的寫法。
{{hovers}}
<ul>{{链接图组
|width= 130
|height= 130
|targetSize= 130
|blockStyle= margin:0 10px;
|class= hovers-fade-shallow
|nav-koias-mira.png，木之幡米拉，{{color|orange|木之幡米拉}}
|nav-koias-ao.png，真中苍
|nav-koias-mai.png，猪濑舞
|nav-koias-mikage.png，樱井美景
|nav-koias-mari.png，森野真理
|@space，远藤幸
}}</ul>
更多實際運用請參考：{{天體的秩序}}、{{迷糊餐廳}}、{{乾物妹！小埋}}等。
參見
| ||||||||||||||||||||||||||||