Font Awesome 【圖標】

前言

本筆記非常簡短!

簡介

Font Awesome爲您提供可縮放的矢量圖標,您可以使用CSS所提供的所有特性對它們進行更改,包括:大小、顏色、陰影或者其它任何支持的效果。

參考

《Font Awesome一套絕佳的圖標字體庫和CSS框架》

示例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="css/font-awesome.min.css" />
        <title>Font-Awesome圖標</title>
    </head>
    <body>
        <i class="fa fa-car"></i>
        <i class="fa fa-car" style="font-size:48px;"></i>
        <i class="fa fa-car" style="font-size:60px;color:red;"></i>
        <i class="fa fa-car fa-lg"></i>
        <i class="fa fa-car fa-2x"></i>
        <i class="fa fa-car fa-3x"></i>
        <i class="fa fa-car fa-4x"></i>
        <i class="fa fa-car fa-5x"></i>
        <ul class="fa-ul">
            <li><i class="fa-li fa fa-check-square"></i>List icons</li>
            <li><i class="fa-li fa fa-spinner fa-spin"></i>List icons</li>
            <li><i class="fa-li fa fa-square"></i>List icons</li>
        </ul>
        <i class="fa fa-spinner fa-spin"></i>
        <i class="fa fa-circle-o-notch fa-spin"></i>
        <i class="fa fa-refresh fa-spin"></i>
        <i class="fa fa-cog fa-spin"></i>
        <i class="fa fa-spinner fa-pulse"></i>
    </body>
</html>

演示

Font Awesome 【圖標】

放大到200%,無失真
Font Awesome 【圖標】

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章