HLS播放器RTSP播放器支持8K播放且低延时高并发全功能流媒体播放器EasyPlayer搭建之HTML中 px,em,rem该如何区别?

EasyPlayer是一款流媒体播放器系列项目,支持RTSP、RTMP、HTTP、HLS、UDP、RTP、File等多种流媒体协议播放、 支持本地文件播放,支持本地抓拍、本地录像、播放旋转、多屏播放、倍数播放等多种功能特性,核心基于ffmpeg,稳定、高效、可靠、可控。

随着多年不断的发展和迭代,不断基于成功的实践经验,发展出包括有: EasyPlayer-RTSP、EasyPlayer-RTMP、EasyPlayerPro 和EasyPlayer.js 等播放器。目前支持Windows、 Android、iOS三个平台,同时EasyPlayer.js还支持Linux平台。

本篇博文我们来讨论以下平台搭建中HTML的px,em,rem该如何区别的问题。

HTML中 px,em,rem该如何区别

PX

px像素(Pixel)。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册)

特点:

  1. IE无法调整那些使用px作为单位的字体大小;
  2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位;
  3. Firefox能够调整px和em,rem,但是96%以上的中国网民使用IE浏览器(或内核)。

EM

em是相对长度单位。

相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。(引自CSS2.0手册)任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 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作为单位就行了。

特点 :

  1. em的值并不是固定的;
  2. em会继承父级元素的字体大小。

rem

rem是css3新增的一个相对长度单位,它的出现是为了解决em的缺点,em可以说是相对于父级元素的字体大小,当父级元素字体大小改变时,又得重新计算。rem出现就可以解决这样的问题,rem只相对于根目录,即HTML元素。所以只要在html标签上设置字体大小,文档中的字体大小都会以此为参照标准,一般用于自适应布局。rem是相对于根目录(HTML元素)的,所有它会随HTML元素的属性(font-size)变化而变化。

posted on 2020-02-24 16:13  TSINGSEE  阅读(230)  评论(0编辑  收藏  举报