iPhoneでアイコン(FontAwesome)を使いたい!
今回は長くなります!スマホでフォント絵使いたい!
- iPhoneでアイコン(FontAwesome)を使う
- 細かい説明、元記事など
- 使用例とテバさんの感想
1.iPhoneでアイコンを使う
←これ!こんなようなやつが使いたかった!
早速やり方です
これをコピーします
<script defer src|="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
そしたら
ココを押します
次に
ココを押します
そうすると
- 見たままモード
- はてな記法
- markdown
と出てきます
ここで【はてな記法】か【markdown】を選びます
次に
ココを押します
そしたら
ココにさっきコピーしたやつを貼り付けします
これで準備は終わり!
↑こんな事もできます。
今回はこれをやってみましょう。
<i class="fab fa-apple fa-7x fa-spin"></i>
コピー出来たら記事を書く所にペースト!
プレビュー画面で確認!
これで出来るハズです( ・ㅂ・)و ̑̑
2.細かい設定、元記事など
さぁ如何でしょうか?出来ましたか?
ここからは自分語りのグダグダを入れつつ、さらに掘り下げていきますね!
ところでね…
htmlやらmetaやらcだのpだの…
私は心が折れそうになりましたね…
むしろ折れましたね…
バッキバキに折れました…
もう折れて折れすぎて粉々の粉…
その粉を水で溶いて排水溝に流してそれが川となり海になる。
やがて雲になり世界を満たすだろう。
おいいいいいい!オメーは何訳わかんない事言ってるんだよおおおおお
はい!
銀魂最終回だったので銀魂風にふざけてみました泣
本当にスミマセンでした!!
いやでもそれぐらい泣きました。
【銀魂終わるの悲しくて泣く】ぐらい泣きました
だって知らないもん!誰も教えてくれないんだもん!
………
いい加減本題に入りますね汗
さらに掘り下げて細かい設定をやっていきます。
私はこの記事を参考にさせて頂きました!
【2018年5月版】はてなブログでFont Awesome5を使う - MogHouse
興味のある方は
fontawesome使い方〜などで検索してみると面白いと思いますよ〜( ・ㅂ・)و ̑̑頑張れ!
さて、肝心の使い方ですが
先ほどの林檎マークのクルクルを色々やってみます
本来は
この大きさ
そしてコードはこれです
<i class="fab fa-apple"></i>
ここのfab fa-appleの後ろに【空白】を一回押してfa-2xと入れてみましょう!
おやおや?すこし大きくなりましたね?
コードはこんな感じに
<i class="fab fa-apple fa-2x"></i>
この【fa-】の後から始まる数字を変える事で大きさ変更が出来るみたいですね!
次はコイツを回してみましょう
<i class="fab fa-apple fa-spin"></i>
どうです?回りました?
↑これももう貴方のものです!
皆様は感が良いから大体お分かりになったんじゃぁないですか?
そうです!
【fa-】を付け足す事で色々な事が出来るんですね!
さらにheadに要素を追加で色々と変える事が出来るらしいです!※これはまたそのうちね!
いやぁ楽しくなってきましたよ!
皆さんもやってみましょう!
何か頭良くなった気分に浸れるZE!
3.使用例とテバさんの感想
ここでは実際の使用例をいくつか紹介!
最近PayPayや楽天ペイやLINE Payやらなんやら…
疑い深い私は使うのを渋ってたのですが……
Amazonペイを使ってみようと思います!
こんな風にアイコンの間に強調したい言葉を挟んだり
アンドロイドの方はこちら
iPhoneの方はこちら
アイコンで見やすくしたり
このアイコン自体にリンクを貼り付けたりも出来ます!出来る予定です!
さてさて、色々やってきましたが、ここからは私の超個人的な意見を書かせて頂きたいです
携帯 ちょ〜〜〜やりづらい!
いちいちプレビューで見なきゃだし
この前記事にした文字の色とか変えるやつも使いづらくなったしさ(ꐦ°᷄д°᷅)なんなん!
世の中のホームページとか凄い事になってるんだろうなぁ〜
見てみたいけど少し怖い笑
でもでも!これを機に少し勉強してみたいな!
ここまで読んでくれた貴方に朗報があります。
このfontawesomeを使える様になると…
ブログのデザインが変えられる様になるらしいです!
それではまたの機会に!
ありがとうごさいました!