# Font Awesome

{% tabs %}
{% tab title="📘 手冊" %}

* :tools: [Font Awesome Icons](https://fontawesome.com/v5.15/icons?d=gallery\&p=2)
  {% endtab %}

{% tab title="👉 相關" %}

* Projects ⟩ [Form Validation](https://lochiwei.gitbook.io/web/js/proj/form-validation)
* [⭐️ 常用](https://lochiwei.gitbook.io/web/master/fav)
  {% endtab %}
  {% endtabs %}

## 使用方法

{% tabs %}
{% tab title="1️⃣ css import" %}

```css
/* import Font Awesome */
@import url("https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.3/css/all.min.css");

/* -- custom styling for all icons -- */
.fas, .fab {
    border: 1px solid black;
    font-size: 48px;
    background-color: white;
    color: black;
}

/* -- custom styling for specific icons -- */
.fa-facebook {
    color: rgb(59, 91, 152);
}
```

{% endtab %}

{% tab title="2️⃣ <link>" %}

```markup
<link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css"
      crossorigin="anonymous"
/>
```

{% endtab %}
{% endtabs %}

* 搜尋 [Font Awesome Icons](https://fontawesome.com/v5.15/icons?d=gallery\&p=2)
* Copy HTML (`<i>` tag)