写在前面

  最近在群里突然看到一个问题,就是px pt em rem 三者的区别,这个问题看起来非常基础,也非常容易被忽略,however,面试会问到~,那我就解释一下

  px        

  px的英文是pixel,翻译过来就是像素,它是一个相对长度,因为素数是随着用户设备的分辨率而改变, 我们常称分辨率低、分辨率高都是相对于设备而言的。

  em        

  是相对于浏览器的默认字体尺寸的字体单位,默认字体大小为16px,也就是说设定 font-size=1em    就得出了1em=16px

  如果设定body的font-size=62.5%   则设定font-size=1.6em  就得出1.6em=16px

  rem        

  rem是相对于html根元素的字体尺寸的字体单位,html页面的根元素为html,则设定了html元素的font-size,就设定了参考单位

  比如设定html的单位为10px,则10rem就为100px

  pt        

  pt是一个印刷单位  ,是一个绝对单位,大小为1/72英寸,

总结

  可见,px em rem 都是相对长度,只有pt是绝对长度

  

关于px、pt、em、rem四个单位的解释的更多相关文章

  1. px,pt,em,rem

    一直对px,pt,em,rem的认识有误区,现整理一下,供参考.之后还得整理下关于dpi相关的知识. px(pixe,像素l):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物 ...

  2. 必备:常用px,pt,em换算表(转)

    常用px,pt,em换算表 pt (point,磅):是一个物理长度单位,指的是72分之一英寸. px (pixel,像素):是一个虚拟长度单位,是计算机系统的数字化图像长度单位,如果px要换算成物理 ...

  3. 弄懂css中单位px和em,rem的区别

              国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢?         PX特点 1. IE无法调整那些使用px作为单位的字体大小 ...

  4. css中字体单位px,pt,em,百分比之间的区别和用法

    px 即像素,一般国内网站使用较多,默认大小是16px; pt 印刷行业常用单位 em  相对单位,相对父元素属性的单位 ,一般用于移动端布局 rem  结合相对定位和绝对定位的优势,相对根元素htm ...

  5. 彻底弄懂css中单位px和em,rem的区别

    国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? PX特点 -1. IE无法调整那些使用px作为单位的字体大小: -2. 国外的大部分网站能够调 ...

  6. CSS中单位px和em,rem的区别

    PX特点: 1 IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firefox能够调整px和em,rem,但是96%以上 ...

  7. 彻底弄懂css中单位px和em,rem的区别 转的自己看

    国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的 ...

  8. 【转载】彻底弄懂css中单位px和em,rem的区别

    原文链接:http://www.cnblogs.com/leejersey/p/3662612.html 国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什 ...

  9. css中单位px和em,rem的区别[转载]

    PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firefox能够调整px和em,rem,但是96%以上 ...

随机推荐

  1. SQL Server中row_number函数的简单用法

    一.SQL Server Row_number函数简介   ROW_NUMBER()是一个Window函数,它为结果集的分区中的每一行分配一个连续的整数. 行号以每个分区中第一行的行号开头. 以下是R ...

  2. 封装Vue Element的table表格组件

    上周分享了几篇关于React组件封装方面的博文,这周就来分享几篇关于Vue组件封装方面的博文,也好让大家能更好地了解React和Vue在组件封装方面的区别. 在封装Vue组件时,我依旧会交叉使用函数式 ...

  3. exe调用DLL的方式

    假设被调用的DLL存在一个导出函数,原型如下: void printN(int); 三种方式从DLL导入导出函数 生成DLL时使用模块定义 (.def) 文件 在主应用程序的函数定义中使用关键字__d ...

  4. Nginx学习简记_part2

    第4章:nginx配置实例 -反向代理 4.1 反向代理实例一 实现效果:使用 nginx 反向代理,访问 www.123.com 直接跳转到 127.0.0.1:8080 4.1.1 实验代码 1) ...

  5. 实现图像的二值化(java+opencv)

    书里的解释: 其他的没找到什么资料,直接参考百度百科 https://baike.baidu.com/item/%E5%9B%BE%E5%83%8F%E4%BA%8C%E5%80%BC%E5%8C%9 ...

  6. 「完整案例」基于Socket开发TCP传输客户端

    ​1 程序界面设计 TCP客户端在上位机开发中应用很广,大多数情况下,上位机软件都是作为一个TCP客户端来与PLC或其他服务器进行通信的.TCP客户端的主要功能就是连接服务器.发送数据.接收数据.断开 ...

  7. Linux下启动、关闭SVN服务

    1.命令:ps -ef|grep svnserve,查看SVN是否允许,执行如下: 2.命令:svnserve -d -r /home/svn,启动SVN,/home/svn是SVN安装路径,执行如下 ...

  8. 这可能是最详细的解析HTTP走私攻击的文章

    前言 HTTP Desync Attacks也就是HTTP走私攻击,是我见到的比较有趣的一种攻击方式,这里来对这种漏洞进行介绍. TL;DR HTTP走私攻击利用了HTTP协议本身的问题:HTTP中存 ...

  9. MyTerm入选北极代码库计划,喜获「Arctic Code Vault Contributor」勋章

  10. go语言之字符串、指针、数组、切片、结构struct、面向对象

    一: 字符串 概述: Go 语言将字符串作为 种原生的基本数据类型,字 符串的初始化可以使用字符串字面量. (1)字符串是常量,可以通过类 数组 索引访问其字节单元,但是不能修改某个字节的值 (2)宇 ...