fuwakani

<h2 id="%E7%92%B0%E5%A2%83">
<a class="header-anchor-link" href="#%E7%92%B0%E5%A2%83" aria-hidden="true"></a> 環境</h2>
<ul>
<li>laravel 8</li>
<li>php 7.3</li>
</ul>
<table>
<thead>
<tr>
<th>スタイル</th>
<th>prefix</th>
<th>font-weight</th>
</tr>
</thead>
<tbody>
<tr>
<td>Solid</td>
<td>fas</td>
<td>900(Free)</td>
</tr>
<tr>
<td>Regular</td>
<td>far</td>
<td>400(Pro)</td>
</tr>
<tr>
<td>Light</td>
<td>fal</td>
<td>300(Pro)</td>
</tr>
<tr>
<td>Brands</td>
<td>fab</td>
<td>400(Free)</td>
</tr>
</tbody>
</table>
💡 font-family 
　無料版："Font Awesome 5 Free" 
　有料版："Font Awesome 5 Pro" 
　Brabds ："Font Awesome 5 Brands"
<div class="code-block-container"><pre class="language-css"><code class="language-css">input.font-awesome-solid-icon::placeholder {
 font-family: "Font Awesome 5 Free";
 font-weight: 900;
 display: inline-block;
 font-style: normal;
 font-variant: normal;
 text-rendering: auto;
}
</code></pre></div><div class="code-block-container"><pre class="language-html"><code class="language-html">&lt;input type="text" name="name" class="form-control font-awesome-solid-icon" placeholder="&amp;#xf002;"&gt;
</code></pre></div><aside class="msg alert">!<div class="msg-content">
cssについて 
🚨 <code>content:"\f002";</code>では表示できなかった（なぜかはわからなかった...） 
🚨 <code>font-family</code>と<code>font-weight</code>がないと表示されない
</div></aside>

スタイル	prefix	font-weight
Solid	fas	900(Free)
Regular	far	400(Pro)
Light	fal	300(Pro)
Brands	fab	400(Free)