Template:Sprites：修订间差异
跳转到导航
跳转到搜索
无编辑摘要 |
标签：回退 |
||
| （未显示2个用户的9个中间版本） | |||
| 第1行： | 第1行： | ||
<includeonly> |
<includeonly>{{#if:{{{thumbcaption|}}}|<div class="image-box" style="{{#if:{{{center|}}}|margin: auto;|display:inline-block;}}width:{{{width|}}};height:{{#expr:{{replace|str={{{height|}}}|ptn=px|rep=}}+25}}px;position:relative;border:1px solid #ccc;background-color:#f9f9f9;">{{Sprites/inside|pic={{{pic|}}}|width={{{width|}}}|height={{{height|}}}|x={{{x}}}|y={{{y}}}|link={{{link|}}}|style={{{style|}}}}}<div class="thumbcaption" style="position:absolute;width:calc(100% - 6px);bottom:0px;overflow:inherit;">{{{thumbcaption|}}}</div></div>|{{Sprites/inside|pic={{{pic|}}}|width={{{width|}}}|height={{{height|}}}|x={{{x}}}|y={{{y}}}|link={{{link|}}}|style={{{style|}}}}}}}</includeonly><noinclude>{{Doc}}[[分类:技术性模板]]</noinclude> |
||
--><div style="margin-top:{{#ifeq:-|{{str_left|{{{y}}}|1}}|{{str_right|{{{y}}}|1}}|-{{{y}}}}};margin-left:{{#ifeq:-|{{str_left|{{{x}}}|1}}|{{str_right|{{{x}}}|1}}|-{{{x}}}}};">[[file:{{PAGENAME:{{{pic|}}}}}|link=]]</div>{{#if:{{{thumbcaption}}}|<div class="thumbcaption" style="position:absolute; width:calc(100% - 6px); bottom:0px; overflow:inherit;">{{{thumbcaption}}}</div>|}}</div></includeonly> |
|||
2023年9月6日 (三) 12:42的最新版本
简介
该模板用于在页面中添加雪碧图（CSS Sprites，或精灵图），可以用于显示大量小图片，而提高图片的加载速度，减少文件获取所消耗的资源。一般可用于展示字母表等需要大量图片的场合。
用法
要使用这个模板可以采取以下的输入格式。
{{Sprites
|pic=图片文件名.jpg
|width=尺寸px
|height=尺寸px
|x=偏移px
|y=偏移px
|link=链入
|thumbcaption=提示语内容
|center=如果居中则填true（无thumbcaption不可用）
|style=额外格式css（不建议）
}}
示例
{{Sprites
|pic=寿险精算数学.png
|width=182px
|height=166px
|x=2px
|y=4px
}}
{{Sprites
|pic=寿险精算数学.png
|width=182px
|height=166px
|x=2px
|y=4px
|thumbcaption=内容
}}
内容
{{Sprites
|pic=寿险精算数学.png
|width=182px
|height=166px
|x=2px
|y=4px
|thumbcaption=内容
|center=true
}}
内容