html中px em pt区别介绍

  HTML 不是一种编程语言，而是一种标记语言 (markup language)，是网页制作所必备的。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。

px、em、pt之间的区别：

一、代表单位不同。

px代表的是像素单位，em代表的是相对单位，pt代表的是绝对单位。

二、单位长度不同

pt是72分之一英寸，px是数字化图像长度单位，em是字符宽度的倍数。

下面我们来看一下HTML中的长度单位px、em、pt。

• pt (point，磅)：是一个物理长度单位，指的是72分之一英寸。

• px (pixel，像素)：是一个虚拟长度单位，是计算机系统的数字化图像长度单位，如果px要换算成物理长度，需要指定精度DPI(Dots Per Inch，每英寸像素数)，在扫描打印时一般都有DPI可选。Windows系统默认是96dpi，Apple系统默认是72dpi。

• em(相对长度单位，相对于当前对象内文本的字体尺寸)：是一个相对长度单位，最初是指字母M的宽度，故名em。现指的是字符宽度的倍数，用法类似百分比，如：0.8em, 1.2em,2em等。通常1em=16px。

html单位简短介绍：

• Px 像素Pixel；相对长度单位。

• Pt 点（Point）；绝对长度单位

• Em 相对长度单位，这里em与html <em>标签的"EM"拼写完全相同，而这里em作为单独文本单位。

单位换算：

任意浏览器的默认字体高度16px（16像素）。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em,10px=0.625em。

为了简化font-size的换算，需要在css中的body选择器中声明font-size=62.5%，这就使em值变为 16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。