因此Google與Adobe也紛紛的推出免費的雲端字型,雖然都是免費,但二者有所不同,Adobe的雲端字型雖然好用,但卻有流量限制,雖然Google無流量限制,但每當使用者在瀏覽網頁時,就得先將字型給下載後,文字才會顯示,因此當剛載入時,像是網站掛掉一樣,但現在CSS3提供了一組新屬性font-display,可以設定雲端字型的載入方式,如此一來就可解決一開始噴白畫面的問題啦!至於這屬性要怎來使用,現在就一塊來看看。
Step1
首先,先到Can I use來了解一下,目前font-dispaly的支援狀況,幾乎所有的主流的瀏覽器都支援,像是Firefox、Chrome、Safari....等。
Step2
而font-display共有四種參數可作設定,同時當要使用時,只需在@font-face中加入即可。
font-display參數:
auto(default):預設值,與block一樣,當載入完時,文字才顯示。
block:當文字加載完畢後,將當前的文字替換過去。
swap:邊載入時,文字套用。
allback:一開始先顯示預設字型,當字型載入完畢後,再一次替換,但加載時間過長時(3秒為限),則會以預設字型文字,則不再加載。
optional:此模式最為特別,會依照使用者的網路狀況,當網路速度太慢時,則不加載字型,以預設的字型為主。
網頁設計.RWD響應式網站.企業形象網站 / 電子工業類
網站技術:PHP . Javascript/MySql
精選專案.網頁設計.RWD響應式網站.行動版網站 / 服務類
網站技術:PHP . Javascript . iOS . Android/MySql
協助民眾了解與申請商標的相關流程與資訊,讓客戶加深專利商標這方面的訊息,以過往的案件來加深大眾對於商標的重要性。甚至可以為不同類型客戶量身打造品牌策略服務、分析對手情況...等等服務。
精選專案.網頁設計.RWD響應式網站 / 服務類
網站技術:Javascript
秉持『正其誼不謀其利 明其道不計其功』的態度來提供服務,並竭盡所能為客戶解決問題。本事務所擁有各種不同領域的律師團隊,能夠因應各種案件並提供最佳的幫助,替客戶爭取最好的結果。
電話:(02)2739-9096 | 傳真:(02)2739-6637 | 客服:[email protected] | 臺北市信義區和平東路3段257號6樓map
© 2019 傑立資訊 All rights reserved.| 網站隱私政策