打开/关闭菜单
切换首选项菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

模板:Fa:修订间差异

来自异世界百科
删除的内容 添加的内容
落雨枫留言 | 贡献
无编辑摘要
落雨枫留言 | 贡献
增加图标变体类型功能
 
(未显示同一用户的8个中间版本)
第1行: 第1行:
<onlyinclude><i class="{{#switch: {{{type|solid}}} | solid = fas | regular = far }} fa-fw fa-{{{icon|}}}{{{i|}}} {{#if: {{{size|}}} |fa-{{{size}}}|}} {{#switch: {{{spin|}}} | true = fa-spin | spin = fa-spin | pulse = fa-pulse }} {{#switch: {{{border|}}} | true = fa-border | 1 = fa-border }} {{#switch: {{{float|}}} | left = fa-pull-left | right = fa-pull-right }}">{{{after|}}}</i></onlyinclude>
<includeonly>
<i class="fa fa-{{{icon|}}}{{{i|}}} {{#if: {{{size|}}} |fa-{{{size}}}|}} {{#switch: {{{spin|}}} | true = fa-spin | spin = fa-spin | pulse = fa-pulse }} {{#ifeq:{{{border|}}}|true|fa-border|}} {{#switch: {{{float|}}} | left = fa-pull-left | right = fa-pull-right }}"></i></includeonly>
<noinclude>
<noinclude>
= Font Awesome =
= Font Awesome =
== 基础用法 ==
== 基础用法 ==
{{fa|icon=star}}<br>
{{fa|icon=star}}<br>
<nowiki>{{fa|icon=star}}</nowiki><br>
<pre><nowiki>{{fa|icon=star}}</nowiki></pre><br>
或<br>
或<br>
<nowiki>{{fa|i=star}}</nowiki>
<pre><nowiki>{{fa|i=star}}</nowiki></pre>


== 大小 ==
== 大小 ==
{{fa|icon=camera-retro|size=lg}} <nowiki>{{fa|icon=camera-retro|size=lg}}</nowiki><br>
{{fa|icon=camera-retro|size=lg}} <pre><nowiki>{{fa|icon=camera-retro|size=lg}}</nowiki></pre><br>
{{fa|icon=camera-retro|size=2x}} <nowiki>{{fa|icon=camera-retro|size=2x}}</nowiki><br>
{{fa|icon=camera-retro|size=2x}} <pre><nowiki>{{fa|icon=camera-retro|size=2x}}</nowiki></pre><br>
{{fa|icon=camera-retro|size=3x}} <nowiki>{{fa|icon=camera-retro|size=3x}}</nowiki><br>
{{fa|icon=camera-retro|size=3x}} <pre><nowiki>{{fa|icon=camera-retro|size=3x}}</nowiki></pre><br>
{{fa|icon=camera-retro|size=4x}} <nowiki>{{fa|icon=camera-retro|size=4x}}</nowiki><br>
{{fa|icon=camera-retro|size=4x}} <pre><nowiki>{{fa|icon=camera-retro|size=4x}}</nowiki></pre><br>
{{fa|icon=camera-retro|size=5x}} <nowiki>{{fa|icon=camera-retro|size=5x}}</nowiki>
{{fa|icon=camera-retro|size=5x}} <pre><nowiki>{{fa|icon=camera-retro|size=5x}}</nowiki></pre>


== 旋转 ==
== 旋转 ==
{{fa|icon=spinner|size=3x|spin=true}} <nowiki>{{fa|icon=spinner|size=3x|spin=true}}</nowiki><br>
{{fa|icon=spinner|size=3x|spin=true}} <pre><nowiki>{{fa|icon=spinner|size=3x|spin=true}}</nowiki></pre><br>
{{fa|icon=spinner|size=3x|spin=pulse}} <nowiki>{{fa|icon=spinner|size=3x|spin=pulse}}</nowiki>
{{fa|icon=spinner|size=3x|spin=pulse}} <pre><nowiki>{{fa|icon=spinner|size=3x|spin=pulse}}</nowiki></pre>


== 边框 ==
== 边框 ==
{{fa|icon=quote-left|size=3x|border=true}} <nowiki>{{fa|icon=quote-left|size=3x|border=true}}</nowiki>
{{fa|icon=quote-left|size=3x|border=true}} <pre><nowiki>{{fa|icon=quote-left|size=3x|border=true}}</nowiki></pre>


== 浮动 ==
== 浮动 ==
{{fa|icon=quote-left|size=3x|border=true|float=left}} <nowiki>{{fa|icon=quote-left|size=3x|border=true|float=left}}</nowiki><br>
{{fa|icon=quote-left|size=3x|border=true|float=left}} <pre><nowiki>{{fa|icon=quote-left|size=3x|border=true|float=left}}</nowiki></pre><br>
{{fa|icon=quote-right|size=3x|border=true|float=right}} <nowiki>{{fa|icon=quote-right|size=3x|border=true|float=right}}</nowiki>
{{fa|icon=quote-right|size=3x|border=true|float=right}} <pre><nowiki>{{fa|icon=quote-right|size=3x|border=true|float=right}}</nowiki></pre>


== 变体 ==
{{fa|icon=star|type=regular}}

{{fa|icon=star|type=regular}}

<pre><nowiki>
{{fa|icon=star|type=regular}}
{{fa|icon=star|type=regular}}
</nowiki></pre>

注意:并不是所有FontAwesome图标都存在变体,具体请参照[https://fontawesome.com/search?o=r&m=free&new=yes FontAwesome 免费版图标列表]
<templatedata>
{
"params": {
"icon": {
"aliases": [
"i"
],
"label": "图标名称",
"description": "FontAwesome的图标名称(不用fa-),可以在 http://fontawesome.com.cn 查找到",
"example": "flag",
"type": "line",
"required": true
},
"size": {
"label": "图标大小",
"description": "可用值:lg, 2x, 3x, 4x, 5x",
"type": "dropdown",
"default": ": 默认\nlg: 大\n2x: 二倍\n3x: 三倍\n4x: 四倍\n5x: 五倍"
},
"spin": {
"label": "是否旋转",
"description": "spin: 旋转, pulse: 8位旋转",
"type": "dropdown",
"default": ": 不旋转\nspin: 连续旋转\npulse: 8帧间断旋转"
},
"border": {
"label": "边框",
"description": "是否位图标添加边框",
"type": "boolean",
"default": "0"
},
"float": {
"label": "浮动",
"description": "left: 浮动于左侧, right: 浮动于右侧",
"type": "dropdown",
"default": ": 不浮动\nleft: 左侧\nright: 右侧"
},
"type": {
"label": "变体类型",
"description": "图标的变体类型",
"example": "solid",
"suggestedvalues": [
"solid",
"regular"
]
}
},
"format": "inline",
"description": "为页面添加FontAwesome图标"
}
</templatedata>
</noinclude>
</noinclude>

2023年5月11日 (四) 09:01的最新版本

Font Awesome

基础用法


{{fa|icon=star}}



{{fa|i=star}}

大小

{{fa|icon=camera-retro|size=lg}}


{{fa|icon=camera-retro|size=2x}}


{{fa|icon=camera-retro|size=3x}}


{{fa|icon=camera-retro|size=4x}}


{{fa|icon=camera-retro|size=5x}}

旋转

{{fa|icon=spinner|size=3x|spin=true}}


{{fa|icon=spinner|size=3x|spin=pulse}}

边框

{{fa|icon=quote-left|size=3x|border=true}}

浮动

{{fa|icon=quote-left|size=3x|border=true|float=left}}


{{fa|icon=quote-right|size=3x|border=true|float=right}}

变体

{{fa|icon=star|type=regular}}
{{fa|icon=star|type=regular}}

注意:并不是所有FontAwesome图标都存在变体,具体请参照FontAwesome 免费版图标列表

为页面添加FontAwesome图标

模板参数

此模板首选参数不换行的行内格式。

参数描述类型状态
图标名称icon i

FontAwesome的图标名称(不用fa-),可以在 http://fontawesome.com.cn 查找到

示例值
flag
单行文本必需
图标大小size

可用值:lg, 2x, 3x, 4x, 5x

默认值
: 默认

lg: 大 2x: 二倍 3x: 三倍 4x: 四倍

5x: 五倍
单选可选
是否旋转spin

spin: 旋转, pulse: 8位旋转

默认值
: 不旋转

spin: 连续旋转

pulse: 8帧间断旋转
单选可选
边框border

是否位图标添加边框

默认值
0
布尔可选
浮动float

left: 浮动于左侧, right: 浮动于右侧

默认值
: 不浮动

left: 左侧

right: 右侧
单选可选
变体类型type

图标的变体类型

推荐值
solid regular
示例值
solid
未知可选