解決辦法:
一、字蛛
原理
爬行本地 html 文檔,分析所有 css 語句
記錄@font-face語句聲明的字體,并且記錄使用該字體的 css 選擇器
通過 css 選擇器的規則查找當前" />

国产精品一区电影_国产男女无遮挡猛进猛出_日本丰满熟妇videossex8k_中文字幕无码乱人伦,久久综合伊人77777麻豆,亚洲最大在线观看,无码人妻久久一区二区三区app

武漢互贏網絡科技股份有限公司

為企業創品牌·從營銷型網站建設開始·互贏懂技術·更懂品牌營銷

24小時熱線

159 7210 9576027-89992189

您的位置:首頁 > 新聞資訊 > 行業百科 > 技術百科

網頁特殊字體過大的優化

作者:龍 時間:2018-07-20 瀏覽:

解決辦法:

一、字蛛

原理

  1. 爬行本地 html 文檔,分析所有 css 語句

  2. 記錄@font-face語句聲明的字體,并且記錄使用該字體的 css 選擇器

  3. 通過 css 選擇器的規則查找當前 html 文檔的節點,記錄節點上的文本

  4. 找到字體文件并刪除沒被使用的字符

  5. 編碼成跨平臺使用的字體格式

font-spider 僅適用于固定文本,如果文字內容為動態可變的,新增的文字將無法顯示為特殊字體。

使用步驟:

1.安裝node.js;

2.安裝字蛛:

npm install font-spider -g 

3.運行字蛛

font-spider C:UserswangchaoDesktopindex*.html 
<!--也就是你的html完整路徑 * 是通配符,表示會掃描所有的html文件 -->
<!--要是打包單個html中使用的特殊字體文字,將文件名改成對應的文件名-->

4.運行完后


<!--發現字體文件的根目錄多了一個font文件夾,文件夾里存放的是原來字
體文件的備份,而網頁引用的是使用字蛛后壓縮保存的字體-->

二、在線提取字體

字體生成器

    <!--css-->
    .font {
        font-size: 32px;
        color: skyblue;
        font-family: 'sx';
    }
    
    @font-face {
        font-family: 'sx';
        src: url('suxin-subfont.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
    
    <!--html-->
     <p class="font">京德匠心鑄器</p>

搜狗截圖20180716120616.jpg

也可以看出來字體文件生效了,但是同樣,也不支持動態的添加的文字

最新動態

常見問題百寶箱

全國服務熱線

027-89992189

掃一掃關注微信

Copyright 2013-2020 All Rights Reserved 武漢互贏網絡科技股份有限公司 鄂ICP備19027860號

獲取品牌營銷方案

快速填寫

馬上獲取

互聯網低成本創名牌從此開始!

主站蜘蛛池模板: 桂东县| 鲁甸县| 霍林郭勒市| 武安市| 绥德县| 黔西| 霞浦县| 绥宁县| 华坪县| 游戏| 湾仔区| 英吉沙县| 盘山县| 岳西县| 沅江市| 卓尼县| 渭南市| 昭平县| 滕州市| 宁河县| 中山市| 舟山市| 德阳市| 洮南市| 赤水市| 龙胜| 河曲县| 长治县| 齐河县| 鲜城| 峨边| 车致| 凯里市| 万州区| 江油市| 高碑店市| 奉节县| 石屏县| 高唐县| 莱阳市| 文成县|