px+em+rem+pt的区别

1.px:(Pixel)单位名称像素,相对长度单位,是相对显示器屏幕分辨率而言的。国内使用的多。
2.em:单位名称为相对长度单位,相对于当前对象内文本的字体尺寸。如果当前对行内文本的字体尺寸未被人设置,则相对于浏览器的默认字体尺寸。国外使用的多。
3.pt:单位名称为点(point),绝对长度单位一般老版本的table使用,现在已经不用了。
4.rem:是CSS3中新增加的一个单位值,是相对长度单位。
em是相对于元素的父元素的font-size进行计算。
rem是相对于根元素html的font-size进行计算。
这样rem就绕开了复杂的层级关系,实现了类似于em单位的功能。
解析:
px特点:
IE无法调整那些使用px作为单位的字体大小;
国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;
Firefox能够调整px和em,rem,但是96%以上的中国网民使用IE浏览器(内核)
em特点:
em的值并不是固定的;
em会继承父级元素的字体大小;
任意浏览器的默认字体都是16px,所有未经调整的浏览器都符合;1em=16px.  
为了简化font-size的换算,需要在css中的选择器中声明Font-size=62.5%,这就使em的值变为

猜你喜欢

转载自blog.csdn.net/DreamsTom/article/details/53443796