Q&A
何かエラーは出ていませんか？
前提・実現したいこと
<script src="https://kit.fontawesome.com/521d914907.js" crossorigin="anonymous"></script>⬆️上記はFont Awesomeからコピペして使用したscriptですが、
<i class="fas fa-arrow-up bg-pink" data-fa-transform="grow-16"></i>
のコードによるアイコンの拡大表示が出来ません。
⬇️下記のドットインストールの学習動画からコピペしたscriptだと、
上手くアイコンを拡大表示することが出来ました。
Font Awesomeからコピペしたscriptなのに、そちらの方がアイコンが上手く表示されないのは何故でしょうか？教えて下さい。
MacBook Proを使っています。
ブラウザはChromeです。
エディタはVS Codeです。
コードは全体提示してください。
あと「コピペした」元のURLも提示してください
返信が遅くなってしまいすみません。
エラーは出ていませんが、下記がコード全体です。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>MyPaage</title>
<script src="https://kit.fontawesome.com/521d914907.js" crossorigin="anonymous"></script>
↑が上手く表示されないscriptです。
↓が上手く表示してくれるscriptです。
<script defer src="https://use.fontawesome.com/releases/v5.0.4/js/all.js"></script>
<style>
.bg-pink {
background: pink;
}
</style>
</head>
<body>
<i class="fas fa-arrow-up"></i>
<i class="fas fa-arrow-up bg-pink" data-fa-transform="grow-16"></i>
<hr>
<i class="fas fa-arrow-up"></i>
<i class="fas fa-arrow-up bg-pink fa-2x"></i>
</body>
</html>
すみません元のURLとは何の事でしょうか？
回答2件
0
Heads Up!
This feature requires that you use our SVG + JS version of Font Awesome.
Power Transforms | Font Awesome
勝手訳：
「注意！
この機能は、SVG + JS バージョン限定です。」
ご提示のjsコードを拝見しましたが、おそらく、WebFont バージョンです。
投稿2020/06/17 03:51
総合スコア36960
0
自己解決
Settings の中でwebフォント選択からsvg選択にすると上手くいきました。
投稿2020/06/26 23:19
総合スコア5
あなたの回答
tips
プレビュー
