MediaWiki模板:如何让图标随文本大小缩放(无需自定义CSS)
在MediaWiki中实现随文本缩放的图标模板(无需自定义CSS)
MediaWiki默认的文件引用语法确实只支持px作为尺寸单位,但不用自定义CSS也有几种方法实现图标随文本缩放的需求:
方法1:行内样式实现自动缩放
直接用HTML<span>包裹图片,通过行内样式设置图标高度为1em(与当前文本字号绑定),同时对齐文本:
<span style="display: inline-block; vertical-align: middle; height: 1em; width: auto;"> [[File:Icon.png|frameless|link=]] </span>
- 说明:
height:1em会让图标高度自动匹配所在位置的文本字号,vertical-align:middle确保图标和文本垂直对齐,link=去掉图片默认的文件页面链接避免干扰。大部分现代MediaWiki版本都支持这种写法。
方法2:模板参数手动适配尺寸
给模板添加可选的尺寸参数,在不同场景(如标题、正文)手动传入对应px值:
模板代码:
{{#if: {{{size|}}} | [[File:Icon.png|frameless|{{{size}}}]] | [[File:Icon.png|frameless|20px]] }}
- 使用示例:
- 正文里用:
{{IconTemplate}}(默认20px) - 标题里用:
{{IconTemplate|size=30px}}(手动指定大尺寸)
这种方法兼容性最好,适合所有MediaWiki版本。
- 正文里用:
方法3:上下文判断半自动适配
通过模板参数标记使用场景,自动切换尺寸:
模板代码:
{{#ifeq: {{{context|}}} | heading | [[File:Icon.png|frameless|30px]] | [[File:Icon.png|frameless|20px]] }}
- 使用示例:
- 标题中:
{{IconTemplate|context=heading}} - 正文中:
{{IconTemplate}}
- 标题中:
内容的提问来源于stack exchange,提问作者awe
相关产品推荐
相关产品推荐

