[CSS]Font Awesome 5でWEBフォントを背景で指定する

CSS

ボタンにFont Awesome 5の矢印を指定

<link rel="stylesheet" href="fontawesome/css/all.min.css">
<style>
.btn	{
	position: relative
}

.btn:after,
.btn:before           {
	position: absolute;
	font-family: "Font Awesome 5 Free";
	font-weight: 900
}

.btn:after    {
	right: 1em;
	content: '\f054';
	font-size: 100%;
	line-height: 1
}

.btn:before      {
	left: 1em;
	content: '\f104';
	font-size: 100%;
	line-height: 1
}
</style>

ポイントは、font-family: "Font Awesome 5 Free" と、font-weight: 900 を記述すること。
この記述がないとアイコンが表示されません。