原 設計稿中字型pt與px之間的轉化

2022-01-13 04:38:44 字數 895 閱讀 5883

通常,設計網頁時,字型一般會使用畫素(px)或者倍數(em)。某一天開始重構頁面,用ps開啟設計師給過來的稿子,開始切圖,在檢視文字時,發現字型大小是用pt來設定的,⊙﹏⊙b汗,如下圖:

px就是表示pixel,畫素,是螢幕上顯示資料的最基本的點;

pt就是point,是印刷行業常用單位,等於1/72英吋。

這樣很明白,px是乙個點,它不是自然界的長度單位,誰能說出乙個「點」有多長多大麼?可以畫的很小,也可以很大。如果點很小,那畫面就清晰,我們稱它為「解析度高」,反之,就是「解析度低」。所以,「點」的大小是會「變」的,也稱為「相對長度」。

pt全稱為point,但中文不叫「點」,查金山詞霸可以看到,確切的說法是乙個專用的印刷單位「磅」,大小為1/72英吋。所以它是乙個自然界標準的長度單位,也稱為「絕對長度」。

pixel是相對大小,而point是絕對大小

px是以螢幕象素為單位。

pt是以1/72英吋為單位

計算公式如下:

那麼1px = 1pt * 影象解析度/72

此時我們可以把設計稿的每個pt單位換算為px,如果設計稿中的文字比較少,那還好計算,如果多呢?

其實不用那麼麻煩,這裡介紹乙個簡單的解決辦法:

選擇後出現如下介面,選擇畫素即可

這樣就可以把設計稿中的pt單位轉換為px了,清楚地看到頁面文字的畫素

ui字型 pt 和 前端字型 px 之間的轉化

在我們開發過程中ui給我們標註的字型通常是用px或者pt標記的,但是oc提供的size的單位值是pt,這往往給我們在計算字型的時候造成一些困擾,許多新手更甚直接用px或者ps去設定字型的大小造成介面的顯示效果與ui圖不符合。1 字型大小的設定單位,常用的有兩種 px 和 pt 這兩個有什麼區別?px...

android中px與sp,dp之間的轉換

android中px與sp,dp之間的轉換 原創 2016年12月17日 22 00 51 標籤 單位轉換 螢幕解析度 螢幕尺寸 dpi 4552 由於android手機廠商很多,導致了不同裝置螢幕大小和解析度都不一樣,然而我們開發者要保持在不同裝置上顯示同樣的視覺效果,就需要做一些適配效果。相關名...

CSS3中的rem值與px之間的換算

rem好像也是乙個相對大小的值,它是相對於根元素,比如假設,我們設定html的字型大小的值為html font size 87.5 也就是14px,這是twentytwelve預設主題裡的設定 然後其他的字型就是將你要的值除以14得到的值 比如預設的twentytwelve主題大小是960px 換算...