iconfont字體圖標的使用方法


1、保存到購物車,下載到本地

網站地址:https://www.iconfont.cn

2、導入項目

下載后,解壓到自己新建的iconfont文件夾下:

項目列表:

iconfont文件夾放到項目目錄中,然后引入iconfont.css文件,路徑要正確

創建一個i標簽或者span標簽,並添加兩個類名:一個固定的是iconfont,另一個是自己下載的圖標對應的類名

基本代碼如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--href后面是iconfont.css所在路徑 -->
    <link rel="stylesheet" href="../iconfont/iconfont.css">
</head>
<body>
    <!--icon-jiarufangjian-01名字一定要注意-->
    <span class="iconfont icon-jiarufangjian-01"></span>
</body>
</html>

改變圖標大小:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--href后面是iconfont.css所在位置-->
    <link rel="stylesheet" href="../iconfont/iconfont.css">
    <style type="text/css">
        .iconfont{
            <!-- 圖標大小 -->
            font-size: 30px;
        }
    </style>
</head>
<body>
    <!--icon-jiarufangjian-01名字一定要注意-->
    <span class="iconfont icon-jiarufangjian-01"></span>
</body>
</html>

注意:


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM