WhatFont Tool - 快速顯示網頁使用的字型、大小與行高

常常在瀏覽網頁時發現很漂亮的字體,想運用到自己的網站或部落格裡,比較有經驗的使用者會去找找網頁原始碼,或是從 CSS 檔裡挖掘出該網站使用的是哪一種字型。而不同的字型組合、樣式、行高與文字大小都會影響到整體的感覺,有沒有辦法可以快速獲取某一段文字的詳細資訊呢?WhatFont Tool 就是一款能快速查詢網頁字型的工具,只要拖曳至瀏覽器書籤,需要時點擊它就能使用。

網站資訊

進入 WhatFont Tool 後,將網頁拉到 How to Use It? ,會看到書籤列(Bookmarklet)及 Chrome 擴充元件(Extension)兩種使用工具,如果不想額外安裝擴充元件的話,使用書籤列就可以了,直接將 WhatFont 的按鈕拖曳到書籤列即可。

2011-04-22-[4]2011-04-22-[5]

在網頁裡點擊「WhatFont」位於書籤列的按鈕,將滑鼠移到文字上方,就會立即顯示出該段文字的字型(Font-family);在點擊一下滑鼠左鍵,會出現很詳細的資料,包括字型名稱(Font-family)、樣式(Style)、厚度(Weight)、大小(Font-Size)與行高(Line-height)五種資訊,很方便吧?

2011-04-22-[3]

如果要離開 WhatFont 查詢模式,只要點擊畫面右上角的「Exit WhatFont」或是按下 ESC 鍵就能切回一般模式。

分享本文