Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 Warning: error_log(/data/www/wwwroot/hmttv.cn/caches/error_log.php): failed to open stream: Permission denied in /data/www/wwwroot/hmttv.cn/phpcms/libs/functions/global.func.php on line 537 狠狠综合久久,亚洲精品一区二三区在线观看,成人永久免费视频 

      

        

          



          
	
          
		
          
			
			
          
				
          整合營銷服務(wù)商
          
				
          電腦端+手機端+微信端=數(shù)據(jù)同步管理
          
			
          
			
          				
				
          免費咨詢熱線：
          			
			
          
		
          
	
          
		
	
	
	

          


          
	

          

 

          
  
          
    
          
      
          
        
          編程VS工具，Html5地圖你選誰？
          
        
           
          
	
	
          
		
                        
          們進行數(shù)據(jù)分析時，為了讓數(shù)據(jù)分析的結(jié)果更好的呈現(xiàn)，我們會選擇數(shù)據(jù)可視化。
          地圖可視化實現(xiàn)的工具有多種，我們今天就單挑兩個一個是編程，一個是可以畫Html5地圖的可視化工具，這里拿億信華辰的ABI為例子。
          編程：

          看看上海的地鐵圖。
          文本提示
          首先，把鼠標(biāo)移到站點、路段、圖標(biāo)等位置，都會有文本提示彈出。
           
           
          站點圖標(biāo)變化
          當(dāng)鼠標(biāo)移到站點上時，站點圖標(biāo)做了放大效果，這個效果很貼心，
           
          實現(xiàn)的方法也很簡便，就是在注冊站點矢量圖形時，加入了動態(tài)判斷。以下注冊普通站點矢量圖形的代碼：
          twaver.Util.registerImage('station',{
    w: linkWidth*1.6,
    h: linkWidth*1.6,
    v: function (data, view) {
        var result = [];
        if(data.getClient('focus')){
            result.push({
                shape: 'circle',
                r: linkWidth*0.7,
                lineColor:  data.getClient('lineColor'),
                lineWidth: linkWidth*0.2,
                fill: 'white',
            });
            result.push({
                shape: 'circle',
                r: linkWidth*0.2,
                fill:  data.getClient('lineColor'),
            });
        }else{
            result.push({
                shape: 'circle',
                r: linkWidth*0.6,
                lineColor: data.getClient('lineColor'),
                lineWidth: linkWidth*0.2,
                fill: 'white',
            });
        }
        return result;
    }
});
           
          動畫效果
          從上圖還可以看到，在換乘站圖標(biāo)中，除了增加了顏色，還實現(xiàn)了旋轉(zhuǎn)效果。。 來看代碼：
          1.    twaver.Util.registerImage('rotateArrow', {
2.        w: 124,
3.        h: 124,
4.        v: [{
5.            shape: 'vector',
6.            name: 'doubleArrow',
7.            rotate: 360,
8.            animate: [{
9.                attr: 'rotate',
10.                to: 0,
11.                dur: 2000,
12.                reverse: false,
13.                repeat: Number.POSITIVE_INFINITY
14.            }]
15.        }]
16.    });
          億信ABI 
          主干線圖，世界航線線路一目了然~
          △主干線圖

          標(biāo)點地圖，如對去過的城市進行標(biāo)點著重突出。
          △標(biāo)點地圖

          渲染地圖，可以看出投放資金的分布情況。
          △資金投放分布圖

          流向圖，清晰的看出從各個地區(qū)流向北京的情況。
          △流向地圖
          疫情大屏
          可能你沒想到，使用億信ABI只需要簡單的托拉拽就可以！不需要大串大串的代碼就能輕松實現(xiàn)！還等什么呢！你也可以去體驗！
          為互聯(lián)網(wǎng)的基石之一，HTML5（Hypertext Markup Language 5）引入了一系列前沿特性，為開發(fā)者提供了無限的創(chuàng)意空間和更深層次的探索。在本文中，華妹將深入解讀HTML5的一些最引人注目的新特性以及它們的潛力。

          1. 語義化標(biāo)簽
          HTML5通過引入諸如`<header>`、`<nav>`、`<article>`和`<footer>`等新的語義化標(biāo)簽，提供了更加精確和結(jié)構(gòu)化的文檔描述。

          這不僅增加了網(wǎng)頁的可讀性，還改進了搜索引擎優(yōu)化（SEO）和可訪問性。開發(fā)者可以更準(zhǔn)確地描述網(wǎng)頁內(nèi)容，使搜索引擎更容易理解頁面的結(jié)構(gòu)。

          2. 視頻和音頻支持
          HTML5為嵌入式媒體提供了原生支持，不再依賴于陳舊的插件，如Flash。

          通過`<video>`和`<audio>`標(biāo)簽，開發(fā)者可以輕松地嵌入視頻和音頻內(nèi)容，并以標(biāo)準(zhǔn)的方式控制媒體播放。這為多媒體豐富的Web應(yīng)用程序帶來了新的可能性，而無需用戶額外地安裝或配置。
          3. 本地存儲

          HTML5引入了Web Storage和IndexedDB，這些本地存儲機制允許開發(fā)者在客戶端存儲數(shù)據(jù)，提高了性能并支持離線訪問。

          這對于構(gòu)建離線Web應(yīng)用程序或緩存大量數(shù)據(jù)的應(yīng)用非常有利。同時，這些新特性提供了更安全的存儲機制，不會像傳統(tǒng)的cookie一樣容易受到跨站點腳本攻擊。
          4. Canvas繪圖

          HTML5的`<canvas>`元素為開發(fā)者提供了在網(wǎng)頁上進行動態(tài)圖形和動畫繪制的能力。

          通過JavaScript，您可以輕松創(chuàng)建交互式圖表、數(shù)據(jù)可視化和游戲。這為用戶提供了更引人入勝的網(wǎng)頁體驗，并吸引了廣泛的應(yīng)用領(lǐng)域，從數(shù)據(jù)科學(xué)到教育。
          5. 新的表單元素

          HTML5引入了一系列新的表單元素，如`<input type="date">`、`<input type="email">`和`<input type="url">`，簡化了用戶輸入和數(shù)據(jù)驗證。這些元素不僅提高了用戶體驗，還減少了開發(fā)者在前端驗證方面的工作量。

          6. 高級的地理位置API
          HTML5的地理位置API允許Web應(yīng)用程序訪問用戶的位置信息，從而創(chuàng)造了各種基于位置的應(yīng)用，如地圖導(dǎo)航、社交媒體定位和周邊服務(wù)推薦。這一功能為個性化和本地化體驗提供了強有力的支持。
          7. Web Workers
          HTML5引入的Web Workers允許在后臺運行JavaScript線程，提高了網(wǎng)頁的性能和響應(yīng)能力。

          這對于處理復(fù)雜計算、多線程任務(wù)以及實時數(shù)據(jù)更新至關(guān)重要，為現(xiàn)代Web應(yīng)用程序帶來了巨大的潛力。
          8. 支持SVG
          HTML5對可伸縮矢量圖形（SVG）提供了原生支持，這是一種用于創(chuàng)建矢量圖形的XML格式。

          SVG允許開發(fā)者創(chuàng)建高質(zhì)量的圖形和動畫，并與其他HTML元素進行無縫集成。這為創(chuàng)建復(fù)雜的數(shù)據(jù)可視化和引人入勝的交互體驗提供了強大的工具。
          結(jié)論
          HTML5的新特性推動了Web開發(fā)的不斷發(fā)展，并為開發(fā)者提供了更多的創(chuàng)新機會。這些新特性不僅增強了網(wǎng)頁的功能和性能，還提高了用戶體驗和可訪問性。
          在不斷演進的Web領(lǐng)域中，深入了解和充分利用HTML5的潛力是每位現(xiàn)代開發(fā)者的必備技能。隨著HTML5的不斷發(fā)展，我們可以期待更多驚喜和創(chuàng)新的出現(xiàn)，為Web的未來鋪平道路。
          做手機端 Web App 項目中,經(jīng)常會遇到小圖標(biāo)在手機上顯示比較模糊的問題，經(jīng)過實踐發(fā)現(xiàn)了一種比較好的解決方案，圖標(biāo)字體化。在微社區(qū)項目中，有很多小的 Icon（圖標(biāo)），如分享、回復(fù)、贊、返回、話題、訪問、箭頭等，這些 Icon（圖標(biāo)）一般都是純色的。開始制作時考慮用雙倍大小的 Sprite 圖，通過 CSS 樣式設(shè)置只顯示二分之一尺寸，這樣在 Retina 屏上顯示的大小是正常的，一旦放大屏幕后圖標(biāo)又變得模糊不清，測試的效果不是很理想，后來又考慮多套圖標(biāo)適配方案、SVG 矢量圖等，都因為種種原因放棄掉了（如多套圖標(biāo)繁瑣、Android 2.3不支持 SVG 格式等），為了解決以上問題，用到了圖標(biāo)字體，下圖為微社區(qū)用到的部分圖標(biāo)字體。
          大家可能在網(wǎng)上看過很多關(guān)于矢量圖標(biāo)制作的教程，而且大多是技術(shù)同學(xué)分享的技術(shù)貼。整個過程也相對比較簡單。在這里我們將深入地向大家講述字體圖標(biāo)制作的規(guī)范流程和注意事項，很多內(nèi)容是現(xiàn)在網(wǎng)上沒有的，純粹是阿里媽媽 MUX 這兩年摸索出來的。阿里媽媽 MUX 在國內(nèi)首家推出了在線生成字體圖標(biāo)平臺，省去了設(shè)計師不太擅長的字體制作過程，所以在本教程中我們就不再詳細介紹如何使用字體制作工具制作字體圖標(biāo)的過程，更多的是介紹如何在 AI 工具中制作一個規(guī)范的字體圖標(biāo)。
          一、制作前基礎(chǔ)知識普及
          1、在制作圖標(biāo)前請下載由阿里媽媽 MUX 提供的矢量圖標(biāo)制作模板；立即下載
          2、盡量使用 illustrator 制作矢量圖標(biāo)；有些設(shè)計師在 ps 中使用路徑繪制圖標(biāo)再導(dǎo)成 SVG，這種方式也是可以的，但是有時會出現(xiàn)一些奇怪的現(xiàn)象，如圖形的路徑混亂了，圖標(biāo)傾斜了等不可預(yù)知的情況，所以還是建議大家在 illustrator 中繪制矢量圖標(biāo)；
          3、將 illustrator 中繪制的圖形另存為 SVG 格式；最初 iconfont 平臺是支持 EPS 文件上傳的，但是考慮到 EPS 文件在平臺生成過程的不穩(wěn)定性，所以現(xiàn)在統(tǒng)一采用 SVG 格式；illustrator 中 SVG 格式導(dǎo)出具體教程>> iconfont
          4、在繪制圖標(biāo)的過程中不要使用 AI 圖形模塊的旋轉(zhuǎn)、鏡像等功能，整個繪制過程最好使用鋼筆工具繪制；^^
          5、避免出現(xiàn)圖形繪制過中斷點的現(xiàn)象。
          6、不可以用色彩疊加的方式來達到模塊造型；
          二、圖標(biāo)柵格
          數(shù)字形態(tài)下，字符是用抽象化的圖案繪制成的。當(dāng)文本顯示在屏幕上時，位置非常精確，理想的字體形狀需要用一定數(shù)量的像素柵格顯示。圖標(biāo)設(shè)計師常用柵格來控制圖標(biāo)組成元素的比例關(guān)系；但是我們在矢量圖標(biāo)制作過程中引入柵格概念主要目的是模擬字體圖標(biāo)在不同尺寸下的展現(xiàn)效果，以達到優(yōu)化的作用；也就是說圖標(biāo)設(shè)計的時候我們用柵格來模擬像素，一個格子就是一個像素，一個圖標(biāo)需要一定數(shù)量的像素組成。
           舉個例子：一個16X16圖標(biāo)，在16X16個像素中通過像素著色的方式把圖形表達出來；
          那有同學(xué)就要問了，通過這樣的柵格能達到什么樣的優(yōu)化效果呢？首先我們來了解一下文字的渲染策略，看組圖：
          從左到右依次）理想的渲染狀態(tài)、黑白渲染、灰度渲染、次像素渲染
          上圖左側(cè)第一張是我們認(rèn)為一種比較理想的渲染效果，但是通過剛才我們介紹柵格我們可以了解到這種狀態(tài)是不可能的，因為第一代黑白渲染和第二代灰度渲染是不可能做到顯示半格像素或一個像素中顯示弧度的。
           黑白渲染和灰度渲染在渲染圖形遇到半格像素或則弧度的時候，他們會有各自不同的處理方式；舉個例子：
          如上圖紅點處像素，我們理解他是有弧度的，且不占滿一個像素；各個渲染方式的處理辦法如下：
          黑白渲染
          黑白渲染相對來說比較粗暴，直接通過四舍五入的形式把這里要描繪的圖形不顯示了；（黑白渲染的形式主要應(yīng)用于打印機渲染，但是打印機本身的精度非常高，所以打印出來的圖形還是很細膩的）
          灰度渲染
          灰度渲染顯得就智能一些了，他通過灰度降級的方式來表達，如果占不到一個像素
          那就根據(jù)他占的面積來降低這個像素的灰度；占的面積越小灰度就越低；
          次像素渲染
          次像素渲染是第三代渲染方式，相對來說比較高級，他從從左至右將一個像素分成三份；用不同的色彩值來顯示圖形，這樣圖形看起來就更加細膩；
          通過了解剛才三種渲染模式對不滿一個像素的處理方式，我們就會發(fā)現(xiàn)，當(dāng)我們繪制圖標(biāo)的時候，如果沒有把控好圖標(biāo)邊緣線在真實場景下渲染的情況，就會被系統(tǒng)進行降級渲染。所以我們更希望能飽滿完整的顯示一個像素。我們來看一組效果：
          從上組圖中我們可以看出左側(cè)圖形的邊都剛好落在完成的像素中，未出現(xiàn)不足一個像素的現(xiàn)象（圓角除外），右側(cè)則未考慮像素柵格的問題；圖標(biāo)在16X16像素大小的應(yīng)用中很明顯感覺到左側(cè)的小圖標(biāo)比右側(cè)的小圖標(biāo)要清晰很多；這是因為右側(cè)的圖標(biāo)的邊本來是需要2個像素顯示的，但是卻落在了3個像素上，渲染的時候出現(xiàn)了一個像素是未降級灰度顯示，其他兩個像素進行了不同級別的灰度降級。這樣我們就會覺得右側(cè)的小圖標(biāo)有點模糊且變粗了。所以在制作圖標(biāo)的時候我們需要引入柵格，去模擬像素點，然后避免圖標(biāo)的線或邊不要出現(xiàn)落在半個像素上的情況；
          了解到了柵格對于圖標(biāo)優(yōu)化的重要性，那怎么制作一個能模擬真實像素環(huán)境下的柵格呢？
          首先我們得了解一下基準(zhǔn)框；基準(zhǔn)框的作用是為字體矢量圖標(biāo)提供一個大小參考，
          如：在16px 像素大小的一個逗號“，”和一個文字“圖”的大小和所處的位子是不一樣的，這就是因為他們都是在同一套基準(zhǔn)框中繪制的圖形，才得到相對大小的概念，不然大家同時矢量圖標(biāo)，怎么區(qū)別大小呢？
          每套字體都有自己不同的基準(zhǔn)框，要根據(jù)實際設(shè)計需要設(shè)定，沒有嚴(yán)格規(guī)定；阿里巴巴矢量圖標(biāo)庫在制定基準(zhǔn)框的時候考慮到圖標(biāo)展現(xiàn)的標(biāo)準(zhǔn)尺寸：16X16、32X32、64X64、128X128；特設(shè)置了一個可以整除他們的尺寸：1024X1024（大家可以通過下載我們制作好的“圖標(biāo)制作模板”獲得已經(jīng)設(shè)置好基準(zhǔn)框的模板）
          根據(jù)實際應(yīng)用的像素大小選擇柵格；
          如：你要制作一套16X16像素大小的字體圖標(biāo)應(yīng)用于網(wǎng)站或 app，那么我們建議您在16X16的柵格中繪制，那么16像素2的 n 倍都能應(yīng)用，這樣圖標(biāo)的邊框就不會落在半個像素上，避免出現(xiàn)虛邊、加粗等現(xiàn)象。（在 retina 屏下不用擔(dān)心圖標(biāo)的虛邊問題，由于顯示精度非常高，圖標(biāo)表現(xiàn)得非常細膩。）
          那如果要制作一個非標(biāo)尺寸的圖標(biāo)，如：18X18大小的圖標(biāo)怎么辦呢？
          我們可以通過在 AI 中修改柵格來實現(xiàn)模擬，如下圖：
          在 AI 設(shè)置中調(diào)出參考線和網(wǎng)格設(shè)置設(shè)置項，然后拿出你的計算機：1024/X=?把算出來的值盡可能精確的填入網(wǎng)格線間隔這項中，這樣你可以模擬在實際應(yīng)用大小場景中要顯示的圖形像素點了。
          三、實例操作
           1、下載模板
          2、在 AI 中刪除模板的示例圖，根據(jù)柵格繪制圖形；
          3、將 AI 中繪制好的圖形另存為 SVG
          4、打開 iconfont.cn 網(wǎng)站并把保存好的 SVG 文件拖入上傳框中
          5、完成上傳，這樣就獲得了一個矢量的字體圖標(biāo)
          使用圖標(biāo)字體的優(yōu)勢和劣勢
          字體圖標(biāo)除了圖像清晰度之外，比位圖還有哪些優(yōu)勢呢?
           1、輕量性：
          一個圖標(biāo)字體比一系列的圖像（特別是在 Retina 屏中使用雙倍圖像）要小。一旦圖標(biāo)字體加載了，圖標(biāo)就會馬上渲染出來，不需要下載一個圖像?？梢詼p少 HTTP 請求，還可以配合 HTML5離線存儲做性能優(yōu)化。
          2、靈活性：
          圖標(biāo)字體可以用過 font-size 屬性設(shè)置其任何大小，還可以加各種文字效果，包括顏色、Hover 狀態(tài)、透明度、陰影和翻轉(zhuǎn)等效果?？梢栽谌魏伪尘跋嘛@示。使用位圖的話，必須得為每個不同大小和不同效果的圖像輸出一個不同文件。
          3、兼容性：
          網(wǎng)頁字體支持所有現(xiàn)代瀏覽器，包括 IE 低版本。詳細兼容性可以點擊這里。
          除了以上優(yōu)勢之外，當(dāng)然也有劣勢
          1、圖標(biāo)字體只能被渲染成單色或者 CSS3的漸變色，由于此限制使得它不能廣泛使用。
          2、使用版權(quán)上有限制，有好多字體是收費的。當(dāng)然也有很多免費開源的精美字體圖標(biāo)供下載使用。
          3、創(chuàng)作自已的字體圖標(biāo)很費時間，重構(gòu)人員后期維護的成本偏高。
          如何獲取圖標(biāo)字體及使用
          要想獲取圖標(biāo)字體，不外乎兩種途徑，其一找到付費網(wǎng)站購買，其二就是到免費網(wǎng)站下載，提供免費下載網(wǎng)站很多，神飛曾經(jīng)發(fā)表過一篇博客 iconfont 大搜羅，上面羅列好多的免費網(wǎng)站的地址，大家有興趣可以去下載。
          如何使用呢？一般來說，有3種方法：
          1、把字符直接寫在 HTML 文件里
          這個方法是簡單比較直觀，見如下代碼，用一個 <span>元素去包含一個 字符“!”(或!)，然后給這個<span>添加一個類。這個字母在選定的字體中被映射到一個特定的圖標(biāo)。
           o <a href=”javascript：;”><span cass=”icon”>!</span>贊</a><a href=” javascript：;”><span cass=”icon”>!</span>贊</a>
          為了顯示效果，還需要編寫樣式類.Icon 來決定此字符以哪種字體來顯示，如下：
          o .icon {font-family: ‘ your-incofont -name ‘;}
          2、使用 css 來生成內(nèi)容
          它不直接在 HTML 文件里添加字符，而是用 CSS 來生成字符內(nèi)容。代碼如下
           <a href=”javascript：;” class=”icon praise”>贊</a>
          可以看出，添加了一個類名“praise”。神奇的事就發(fā)生在 CSS 中，跟上面一樣，第一步先定義好字體，然后使用:before 偽元素來產(chǎn)生字符圖標(biāo)，其中“before”表示字符出現(xiàn)在左邊，“after”則出現(xiàn)在右邊。
          o .icon {font-family: ’ your-incofont-name ’ ;}.praise:before {content:“\f00a”; }
          3、用 data-icon 屬性
          還有一種跟上面相似方法是使用 HTML5的“data-”屬性。如：創(chuàng)建一個 data-icon 屬性。
          aria-hidden=”true”是為了防止被閱讀器直接把字符讀取出來，不是對所有的平臺都奏效。
           o <a href=”javascript：;”><span aria-hidden=”true” data-icon=”!”></span>贊</a>
          結(jié)合一些搭配使用的 CSS 屬性，可以寫成如下代碼
          o [data-icon]:before {font-family: ‘ your-incofont-name ’ ; content:attr(data-icon);speak:none;}
          制作自已圖標(biāo)字體
          以上是免費圖標(biāo)字體使用的幾種方法，下面看看如何制作屬于自己的圖標(biāo)字體。
          1、首先需要有創(chuàng)建矢量圖標(biāo)的軟件，并且能夠輸出 SVG 格式，比如 “Illustrator ”或者“Inkscape”。也可以用 Photoshop 的路徑工具畫出所需要的圖標(biāo)，然后導(dǎo)出路徑到 Illustrator 里去填色。 下圖為 Adobe Illustrator 軟件。
          注意一定是封閉的路徑，不能是單路徑描邊，如果是單路徑的話生成字體圖標(biāo)后會顯示不出來。兩個以上的圖形要合并、圖形盡減少節(jié)點使用。如下圖，中間的圖(嘴巴部分)為單路徑描邊（不封閉）,導(dǎo)入圖標(biāo)生成器后會如右圖所示，嘴巴部分顯示不出來。
          2、圖標(biāo)制作完成后，選擇 “文件”菜單中“保存”，把文件保存成“SVG”格式。使用默認(rèn)的 SVG 設(shè)置。
          3、把 SVG 格式的圖標(biāo)導(dǎo)入到 icomoon、fontello、iconfont 字體生成器中，去生成所要的圖標(biāo)字體，以下介紹一下幾種字體生成器的用法：
          （1）圖標(biāo)字體生成器
          IcoMoon！一個可以通過個性化設(shè)置來創(chuàng)建自定義圖標(biāo)（字體）的生成器！ IcoMoon 是一項免費的服務(wù)，通過使用不同設(shè)置使我們能夠創(chuàng)建自定義的 Icon 圖或 Icon 字體。除了自定義 Icon 外，IcoMoon 也有自己免費的海量圖標(biāo)集，都非常贊。
          打開地址，點擊 Start the App 按鈕。
          點擊 Import Icons 按鈕導(dǎo)入 SVG 圖標(biāo)，導(dǎo)入后對圖標(biāo)進行相關(guān)的操作，如選中、刪除、移動、編輯等。
          編輯完成后，就可以進行下載了，它提供兩種下載方式：圖片版和字體版！圖片版是經(jīng)過 CSS Sprites 技術(shù)處理的 PNG 格式，字體版有多種格式供我們選擇（EOT,SVG,WOFF,TTF）。
          如果要兼容 IE7以下瀏覽器，請在設(shè)置里勾選 Support IE7(and older)選項，會生成一個單獨 JS、CSS 文件。
          下載 ZIP 包后，解壓后會得到如下圖的文件。將 fonts 文件夾復(fù)制到你的網(wǎng)站，為項目添加字體。
          從 style.css 文件中復(fù)制 CSS 樣式，并粘貼到你網(wǎng)站的 CSS 文件中，也可以單獨存成一個樣式文件。
          復(fù)制完成后，在 CSS 文件中找到@font-face，將 URL 路徑修改成你本地的相對路徑。
          字體和路徑都設(shè)置完成后，在 HTML 頁面只需調(diào)用相對應(yīng)的 class 就可以了。如果想兼容 IE7瀏覽器，需引用 IE7目錄的 js。如：
          調(diào)用 class：<span class=”icon icon-add”></span>
          調(diào)用 js：<script src=”ie7/ie7.js”></script>
          （2）圖標(biāo)字體生成器
          它的生成方式與上面的類同，這里不做介紹，很容易上手。
          （3）ISUX 矢量字體圖標(biāo)庫
           ISUX 矢量字體庫目前提供了豐富的字體圖標(biāo)，可以供下載使用，暫時還不支持自定義圖標(biāo)的導(dǎo)入，期待不久的將來它的功能會越來越完善。大家有什么好的建議和想法可以聯(lián)系他們。
          通過以上幾種生成器的生成圖標(biāo)字體，加上用 CSS 對其大小、顏色、透明度、陰影、Transition 各種變換等控制，不僅可以縮放自如，制作出各種特殊效果，而且還很容易維護，可以通過多種不同的途徑對它們進行操作。相信大家已經(jīng)體驗到他的強大之處，滿足日常工作需要應(yīng)該已經(jīng)足夠了。雖然有這么多優(yōu)點，但圖標(biāo)字體并不是完美的，也存在些缺點。如：只能被渲染成單色的問題、屏幕閱讀器(雖然有解決方法，但并不完善)的問題、性能問題等等，等待著我們?nèi)グl(fā)現(xiàn)和解決。相信未來會有更好的解決方案，比如：SVG（可伸縮矢量圖形），未來可能取代位圖的圖形技術(shù)等。
          立足現(xiàn)在，放眼未來。最后對目前的圖標(biāo)字體生成器工具做一下展望吧！
          ■ 能夠支持導(dǎo)入更多的自定義格式，如 EPS、AI 等格式。
          ■ 能夠引入項目管理的機制， 在同一帳號可以同時管理多個項目圖標(biāo)。
          ■ 提供更多免費、豐富的圖標(biāo)字體供下載使用。
          FAQ
          1、跨域問題：
          （1）通過配置自己的服務(wù)器。
          # For Apache
          <FilesMatch “.(eot|ttf|otf|woff)”>Header set Access-Control-Allow-Origin “*” </FilesMatch>
          # For nginx
          location ~* \.(eot|ttf|woff)$ {add_header Access-Control-Allow-Origin *;}
          （2）放在同一個域下。
          （3）使用 base64 置入 CSS 中 (Icomoon 在導(dǎo)出圖標(biāo)時，設(shè)置里勾選Encode & Embed Font in CSS 選項)。
          2、字體圖標(biāo)出現(xiàn)鋸齒的問題：
          -webkit-font-smoothing: antialiased;
          -moz-osx-font-smoothing: grayscale;
          3、@font-face 與性能：
          關(guān)于@font-face 的性能問題，可以參考以下文章。
          原文地址：www.stevesouders.com
          翻譯地址：www.cnblogs.com
          文章內(nèi)的建議和總結(jié):
          （1）只在你確定你非常需要 @font-face 的時候才使用它;
          （2）將你的@font-face 定義在所有的 script 標(biāo)簽前;
          （3）如果你有許多字體文件，考慮將它們分散到幾個域名下;
          （4）不要包含沒有使用的 @font-face 聲明——IE 將不分它使用與否，通通加載;
          （5）Gzip 字體文件，同時給它們一個未來的過期頭部聲明;
          （6）考慮字體文件的后加載，起碼對于 IE。
                              	
          
	
	

          

          

 
          
        
        
		  
      
          
      
      
          
    
          
  
          

          



 


			
		





          
  
          
    
  
          

          

          
	
          
		
		
		
          
	
          


          
 

 







主站蜘蛛池模板：
色屁屁一区二区三区视频国产|
国产亚洲福利一区二区免费看|
国产在线精品一区二区在线观看
|
日韩在线一区二区三区视频|
精品亚洲一区二区|
人妻无码一区二区三区|
天天看高清无码一区二区三区|
日韩欧美一区二区三区免费观看|
影音先锋中文无码一区|
中文字幕在线播放一区|
亚洲国产精品一区二区三区久久
|
亚洲av无码片vr一区二区三区|
亚洲av色香蕉一区二区三区|
无码精品国产一区二区三区免费
|
亚洲一区精品中文字幕|
伦理一区二区三区|
国产精品视频一区|
秋霞鲁丝片一区二区三区|
在线成人一区二区|
国99精品无码一区二区三区|
国产一区韩国女主播|
精品国产一区二区三区久|
国产一区二区三区高清在线观看|
国产激情一区二区三区在线观看
|
一区二区三区四区无限乱码|
久久精品道一区二区三区|
秋霞鲁丝片一区二区三区|
秋霞电影网一区二区三区|
国产乱人伦精品一区二区在线观看|
成人免费一区二区三区|
日本高清天码一区在线播放|
久久精品无码一区二区WWW|
中文字幕在线播放一区|
在线观看国产一区二区三区|
美女视频一区三区网站在线观看|
精品福利一区二区三|
亚洲一区二区三区首页|
久久无码AV一区二区三区|
中文字幕一区二区人妻性色
|
国产一区二区精品久久岳|
亚洲精品色播一区二区|