说说css中pt、px、em、rem都扮演了什么角色

1,586 阅读1分钟

前段时间,终于仔仔细细的把pt、px、em、rem了解了一遍,特意将其相关内容整理成文章,希望能对有需要的人有所帮助。

pt、px、em、rem都是什么

pt单位名称为点(Point),绝对长度单位。现在网页中出现得很少甚至不出现,常用于印刷行业。
单位换算:1in = 2.54cm = 25.4 mm = 101.6q = 72pt = 6pc = 96px

px单位名称为像素,相对长度单位,像素px是相对于显示器屏幕分辨率而言的。像素的使用性特别广。

我有几张阿里云幸运券分享给你,用券购买或者升级阿里云相应产品会有特惠惊喜哦!把想要买的产品的幸运券都领走吧!快下手,马上就要抢光了。


em单位名称为相对长度单位。它没有一个固定数值,相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。

rem是CSS3新增的一个相对单位(root em,根em), rem是相对单位,是相对HTML根元素。

四者的特点和关系

pt是一个标准的长度单位, 1pt=1/72英寸,常用于印刷当中,在AI、PS等设计软件当中字体大小所用的单位就是pt,它在广告印刷业当中十分受欢迎,也非常的好用。但现在在网页当中,pt几乎不出现了。
优点:适用于印刷业
缺点:网页几乎不用了