PT和PX的区别

news/2024/10/19 16:37:53/

字体大小的设置单位,常用的有2种:px、pt。这两个有什么区别呢?

先搞清基本概念:

px就是表示pixel,像素,是屏幕上显示数据的最基本的点;

pt就是point,是印刷行业常用单位,等于1/72英寸。

这样很明白,px是一个点,它不是自然界的长度单位,谁能说出一个“点”有多长多大么?可以画的很小,也可以很大。如果点很小,那画面就清晰,我们称它为“分辨率高”,反之,就是“分辨率低”。所以,“点”的大小是会“变”的,也称为“相对长度”。

pt全称为point,但中文不叫“点”,查金山词霸可以看到,确切的说法是一个专用的印刷单位“磅”,大小为1/72英寸。所以它是一个自然界标准的长度单位,也称为“绝对长度”。

因此就有这样的说法,pixel是相对大小,而point是绝对大小。

分清“屏幕效果”和“打印效果”:

在浏览网页过程中,所有的“大”“小”概念,都是基于“屏幕”这个“界面”上。“屏幕”上的各种信息,包括文字、图片、表格等等,都会随屏幕的分辨率变化而变化,一个100px宽度大小的图片,在800×600分辨率下,要占屏幕宽度的1/8,但在1024×768下,则只占约1/10。所以如果在定义字体大小时,使用px作为单位,那一旦用户改变显示器分辨率从800到1024,用户实际看到的文字就要变“小”(自然长度单位),甚至会看不清,影响浏览。

那是不是用pt做单位就没这样的问题呢?错!问题同样出现。刚才的例子已经很清楚的说明,在不同分辨率下,无论是px还是pt,都会改变大小。以现在的电脑屏幕情况,还没有一种单位可以保证,在不同分辨率下,一个文字大小可以“固定不变”。因为这很难以实现也不是很有必要:全球电脑用户以亿来数,屏幕从14寸到40寸甚至更高都有,屏幕大小不同,分辨率也不同,要保证一个字体在所有用户面前大小一样,实在是MISSION IMPOSSIBLE。另外,电脑有其自身的调节性。

那在页面设计中到底是用px还是pt呢?

我认为,这个并没有什么原则性差异,就看自己处于什么角度思考了。

Mac机怎么情况不清楚,在Windows里,默认的显示设置中,把文字定义为96DPI(PPI,微软都将DPI和PPI混为一体,我们也就无须较真了)。这样的定义,说明了:1px=1/96英寸。联系pt的概念,1pt=1/72英寸,可以得出,在这样的设置中,1px=0.75pt,常见的宋体9pt=12px。在显示器分辨率不变的基础上(比如现在常用的1024×768),1px大小也就固定不变,改变显示设置,调整为144DPI,可以得出,1px=0.5pt,常见的宋体9pt=18px。原先用12px来组成的一个文字,现在需要18px来组成,px多了,文字就“大”了,更易阅读了。

所以,px和pt的使用区别,只有当用户改变默认的96DPI下才会产生:使用px定义文字,无论用户怎么设置,都不会改变大小;使用pt定义文字,当用户设置超过96DPI的值,数值越大,字体就越大。

(附公式:px = pt * DPI / 72) 对了,刚才还提到改变浏览器中文字大小的选项,也可以改变网页的文字大小。但在这种情况下,使用px和pt都是无效的,因为这2个都是有实际“pixel”数值的单位,比如9pt是12px,大小固定。这里要引用新的单位:em,其实就是%。因为当网页中的字体没有给出实际的px或pt定义的话,会有一个默认值:12pt即16px,对应浏览器中“字体大小”中的“中等”,以这个为标准,变大或缩小。(只适用于IE,在FF中,即便定义px或pt也都可以变大变小)

所以,从这个概念上看,em才是真正的“相对单位”(百分比嘛,当然是相对),而px和pt都是绝对单位(都有固定值)。

在网页设计中,面向用户的屏幕的基本单位是px,因此使用px作为单位是最简单也最容易理解的,而pt也不过是通过了Windows的设置乘上了一个比率转变成px再显示,算是绕了个圈子。参考大部分大型网站,包括Adobe和Microsoft,都是使用px作为单位,而且在HTML中,默认的单位就是px,是不是也暗示着px是网页设计的“内定单位”?

但在Word或Photoshop中,使用pt就相当方便。因为使用Word和Photoshop的主要目的都不是为了屏幕浏览,而是输出打印。当打印到实体时,pt作为一个自然长度单位就方便实用了:比如Word中普通的文档都用“宋体 9pt”,标题用“黑体 16pt”等等,无论电脑怎么设置,打印出来永远就是这么大。又或者在Photoshop中,设置一个图片中的某个艺术效果的字体是72pt大小,然后分别将这张图片设为300DPI和72DPI,再打印出来,就可以看出,这2个字体大小完全一样,只是“清晰度”不同,300DPI更清晰。这是毫无疑问的结果。

最后整理一下所有出现过的单位:

px:pixel,像素,屏幕上显示的最小单位,用于网页设计,直观方便;

pt:point,是一个标准的长度单位,1pt=1/72英寸,用于印刷业,非常简单易用;

em:即%,在CSS中,1em=100%,是一个比率,结合CSS继承关系使用,具有灵活性。

PPI(DPI):pixel(dot)per inch,每英寸的像素(点)数,是一个率,表示了“清晰度”,“精度”

PX和PT转换的公式:

以前在文章中介绍过PX和PT的转换规则,其实很简单,pt=px乘以3/4。

比如12px×3/4=9pt大小。

PX和em转换的公式:

对于PX转em的方法也类似,就是em=16乘以px,也就是说1.5em=1.5×16=24px。

设计中常用PX/EM/PT/百分比转换表格

Pixels

EMs

Percent

Points

6px

0.375em

37.50%

5pt

7px

0.438em

43.80%

5.5pt

8px

0.5em

50%

6pt

9px

0.563em

56.30%

7pt

10px

0.625em

62.50%

8pt

11px

0.688em

68.80%

8pt

12px

0.75em

75%

9pt

13px

0.813em

81.30%

10pt

14px

0.875em

87.50%

11pt

15px

0.938em

93.80%

11pt

16px

1em

100%

12pt

17px

1.063em

106.30%

13pt

18px

1.125em

112.50%

14pt

19px

1.188em

118.80%

14pt

20px

1.25em

125%

15pt

21px

1.313em

131.30%

16pt

22px

1.375em

137.50%

17pt

23px

1.438em

143.80%

17pt

24px

1.5em

150%

18pt

字号 磅数 毫米

八号 5磅 1.84

七号 5.5磅 2.12

小六号 6.5磅 2.45

六号 7.5磅 2.81

小五号 9磅 3.15

五号 10.5磅 3.70

小四号 12磅 4.25

四号 14磅 4.93

小三号 15磅 5.23

三号 16磅 5.55

小二号 18磅 6.37

二号 22磅 7.80

小一号 24磅 8.42

一号 26磅 9.66

小初号 36磅 11.1

初号 42磅 12.7

(附公式:px = pt * DPI / 72)


http://www.ppmy.cn/news/496357.html

相关文章

化妆品行业知识分享

目录 一、产品基本信息 1.产品的组成 2. 产品分类 3.常见术语 二、产品特性 1.生产特性 2.销售特性 3.采购特性 4.研发特性 三、行业痛点与解决方案 1.行业主要存在的痛点 2.日常业务解决方案: 3.供应商管理解决方案: 四、总结 一、产品基本信息 1.产品的…

【MySQL新手入门系列四】:手把手教你MySQL数据查询由入门到学徒

SQL语言是与数据库交互的机制,是关系型数据库的标准语言。SQL语言可以用于创建、修改和查询关系数据库。SQL的SELECT语句是最重要的命令之一,用于从指定表中查询数据。在此博客中,我们将进一步了解SELECT语句以及WHERE子句以及它们的重要性。…

链接器工具错误 LNK2005

问题描述:链接器工具错误 LNK2005 解决方法 将除了调试源程序以外的所有源程序的属性改成不参与生成,然后调试即可解决该问题。 1.右击源程序,点击属性 2.选择不参与生成,然后点击应用 3.调试程序,问题解决。

STC15系列 8系列解码红外遥控器(NEC协议)(12mhz)

本次解码过程,使用【外部中断0】,【定时器0】相互组合 废话少续,直接上源代码,只需要简单修改,即可完成配置 /*// 功 能:STC8系列,15系列,中断解码红外NEC协议(12m…

STC15F2K60S2单片机

iap15f2k60s2是我们蓝桥杯8051d单片机开发板上的芯片,但是我们在keil4仿真软件里所引用的头文件是stc15f2k60s2。因为在单片机中,IAP和STC是同一系列产品。IAP和STC的最大区别在于:IAP可以将用户程序中的FLASH当做EEPROM使用,虽然…

KeilC51使用教程

1 点击桌面上的Keil uVision4图标,出现启动画面: 2. 点击“project — New uVision Project”新建一个工程: 3. 给这个工程取个名, 然后保存, 工程的后缀为uvporj。 4.弹出一个框,在CPU类型下我们找到并选中…

对于reg51.h、reg52.h、regx52.h、stc15f2k60s2.h的思考

早在学习51单片机时就在想这几个头文件到底有什么区别,在不同的地方有不同的用法。现在再回过头来看心中不禁了然。 reg52.h和stc15f2k60s2.h对于使用蓝桥杯的板子,都可以正常使用,但是又有一些区别,简单来说,我们单片…

MCS-51单片机 特殊功能寄存器(SFR)

在80C51单片机中设置了与片内RAM统一编址的21个特殊功能寄存器(SFR)。访问SFR只允许使用直接寻址方式。特殊功能寄存器(SFR)每一位的定义和作用与单片机各部件直接相关。 1. 与运算器相关的寄存器(3个) ①累…