字体很棒的SVG -PHP
可以用来添加字体Awesome 6+的SVG图标的PHP类，而无需JavaScript。
安装
您可以使用作曲家安装它：
composer require husseinalhammad/fontawesome-svg
或者，您可以下载FontAwesomeSVG.php文件并手动包含它。
用法
文件
- 下载字体很棒（免费或专业）
- 获取文件夹
advanced-options/raw-svg并将其放入您的项目中 - 将
svg-with-js/css/fa-svg-with-js添加到您的文档中（或编写您的CSS）
例子
// $dir = directory where SVG files are $ FA = new FontAwesomeSVG ( $ dir ); echo $ FA -> get_svg ( \' fa-solid fa-file \' );
添加自定义类：
echo $ FA -> get_svg ( \' fa-solid fa-file \' , [ \' class \' => \' my-custom-class another-class \' ]);
删除默认类.svg-inline--fa ：
echo $ FA -> get_svg ( \' fa-solid fa-file \' , [ \' default_class \' => false ]);
更改<path>填充（默认为currentColor ）：
echo $ FA -> get_svg ( \' fa-solid fa-file \' , [ \' fill \' => \' #f44336 \' ]);
添加<title></title> ：
echo $ FA -> get_svg ( \' fa-solid fa-file \' , [ \' title \' => \' My accessible icon \' ]);
一次多个选项：
echo $ FA -> get_svg ( \' fa-solid fa-file \' , [ \' class \' => \' my-custom-class another-class \' , \' default_class \' => false , \' title \' => \' My title \' , \' role \' => \' img \' , \' fill \' => \' #ffffff \' , ]);
自定义Duotone图标：
echo $ FA -> get_svg ( \' fa-duotone fa-laugh-wink \' , [ \' primary \' => [ \' fill \' => \' #e64980 \' , ], \' secondary \' => [ \' fill \' => \' #fcc417 \' , \' opacity \' => \' 1 \' , ], ]);
| 选项 | 这意味着什么 |
|---|---|
| 班级 | 将类添加到SVG标签 |
| default_class | 如果设置为false ，则默认CSS类不会添加到SVG标签中。 DeAfult： true 。 |
| inline_style | 是否将Duotone样式作为内联样式添加到<svg>标签中。 DeAfult： true 。 |
| 标题 | 在语义图标的SVG标签中添加<title> |
| title_id | 将id属性添加到<title>中，并在SVG标签上添加aria-labelledby具有相同的值 |
| 角色 | SVG标签中role属性的值。默认值： img |
| 充满 | SVG内部<path>中fill属性的值。默认值： currentColor |
| 基本的 | 双酮主要选项（请参见下表） |
| 次要 | Duotone辅助选项（请参见下表） |
Duotone
需要v5.10.0或更高的v5.10.0和Fontawesome Pro许可证
锋利的
需要v6.4.0或更高的v6.4.0和Fontawesome Pro许可证
echo $ FA -> get_svg ( \' fa-sharp fa-light fa-file \' ); echo $ FA -> get_svg ( \' fa-sharp fa-regular fa-file \' ); echo $ FA -> get_svg ( \' fa-sharp fa-solid fa-file \' );
选项
如果启用了inline_style ，则在<svg>标签上的内联样式中也使用了fill和opacity的值。
| 选项 | 这意味着什么 |
|---|---|
| 充满 | SVG内部<path>中fill属性的值。默认值： currentColor |
| 不透明度 | SVG内部<path>中opacity属性的值。 |
示例：
单色：
echo $ FA -> get_svg ( \' fad fa-laugh-wink \' , [ \' fill \' => \' #e64980 \' , ]);
交换层不透明度：
echo $ FA -> get_svg ( \' fad fa-laugh-wink \' , [ \' fill \' => \' #e64980 \' , \' class \' => \' fa-swap-opacity \' , ]);
具有自定义不透明度的单色：
echo $ FA -> get_svg ( \' fad fa-laugh-wink \' , [ \' fill \' => \' #e64980 \' , \' secondary \' => [ \' opacity \' => \' 0.2 \' , ], ]);
自定义颜色和不透明度：
echo $ FA -> get_svg ( \' fad fa-laugh-wink \' , [ \' primary \' => [ \' fill \' => \' #e64980 \' , \' opacity \' => \' 0.5 \' , ], \' secondary \' => [ \' fill \' => \' #fcc417 \' , \' opacity \' => \' 1 \' , ], ]);
别名
版本5的简短别名仍得到支持
echo $ FA -> get_svg ( \' fab fa-twitter \' ); echo $ FA -> get_svg ( \' fad fa-file \' ); echo $ FA -> get_svg ( \' fal fa-file \' ); echo $ FA -> get_svg ( \' far fa-file \' ); echo $ FA -> get_svg ( \' fas fa-file \' ); // And the new shorthands for thin and sharp echo $ FA -> get_svg ( \' fat fa-file \' ); // thin echo $ FA -> get_svg ( \' fasl fa-file \' ); // sharp-light echo $ FA -> get_svg ( \' fasr fa-file \' ); // sharp-regular echo $ FA -> get_svg ( \' fass fa-file \' ); // sharp-solid
可访问性
以下基于：
- 字体很棒的可访问性文档
- Heather Migliorisi关于CSS-Tricks可访问的SVG的文章
role属性
role="img"默认情况下添加到SVG标签中：
< svg role =\" img \" > </ svg >
<title> ， aria-labelledby
您可以设置一个<title> ， <title>的id ，并且将自动添加aria-labelledby属性：
echo $ FA -> get_svg ( \' fa-solid fa-file \' , [ \' title \' => \' File \' , \' title_id \' => \' file-id \' , ]);
< svg aria-labelledby =\" file-id \" > < title id =\" file-id \" > File </ title > </ svg >
aria-*属性
您可以将任何ARIA-*属性添加到SVG标签：
echo $ FA -> get_svg ( \' fa-solid fa-file \' , [ \' aria-label \' => \' File \' , ]);
< svg aria-label =\" File \" > </ svg >
aria-hidden属性
默认情况下， aria-hidden="true"默认为SVG标签，除非设置<title id=""> （和aria-labelledby ）或aria-label设置。
echo $ FA -> get_svg ( \' fa-solid fa-file \' );
< svg aria-hidden =\" true \" > </ svg >
