#名词区别篇：px、em、rem、rpx、vh、vw、vmin 、vmax、%用法与区别

2024-06-24 14:24:31

px

像素，相对长度单位，相对于显示器屏幕分辨率而言

em

相对长度单位，相对于当前对象内文本的字体尺寸。
如果当前文本字体尺寸没有设置，则相对浏览器默认字体尺寸。
特点：
1.值不是固定的
2.会继承父的字体大小
注意：浏览器默认的字体都是16px。1em = 16px；0.625em = 10px
body中font-size=62.5%,及16px*62.5% =10px 转换基准 1em = 10px

rem

rem是css3新增的一个相对单位（root em,根em）
与em的区别
rem为元素设定字体大小是，为相对大小，相对的根是HTML根元素
优点之修改根源素就成比例的调整所有字体大小

rpx

rpx可根据屏幕宽度进行自适应。
规定屏幕宽为750rpx。iphone上屏幕宽375px,共750物理像素
750rpx = 375px = 750物理像素 1px = 0.5px=1物理

vh

相对于viewport视窗的宽高进行计算单位
相对视窗高度的单位
1vh = 1/100浏览器高度

vw

相对视窗宽度的单位
1vw = 1/100浏览迪宽度

vmin & vmax

vmin：取当前Vw和Vh中较小的那一个值
vmax：取当前Vw和Vh中较大的那一个值

%

相对长度单位，相对于父元素的百分比

#名词区别篇：px、em、rem、rpx、vh、vw、vmin 、vmax、%用法与区别相关推荐

px,em,rem,vh,vw,vmin,vmax的区别
css手册中关于font-size是这么介绍的: font-size 值可以是绝对或相对值. 绝对值: 将文本设置为指定的大小不允许用户在所有浏览器中改变文本大小(不利于可用性) 绝对大小在确定了输 ...
CSS单位--px,em,rem,rpx区别
国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢? Px PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够 ...
px,em,rem,rpx 单位的用法和区别
px px像素(Pixel).相对长度单位.像素px是相对于显示器屏幕分辨率而言的. 特点 IE无法调整那些使用px作为单位的字体大小: 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体 ...
css3中单位px,em,rem,vh,vw,vmin,vmax的区别及浏览器支持情况
px:绝对单位,页面按精确像素展示 em:相对单位,基准点为父节点字体的大小,如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值. rem:相对 ...
认识css长度单位 px % em rem vh vw
目录长度单位 px % em rem vh.vw 总结长度单位在日常的项目开发,在使用css样式进行时布局的时候,我们常常用到px.%.em这三个单位.CSS3开始,浏览器新增加了rem.vh. ...
网页布局中的 px,em,rem,pt
网页布局中的 px,em,rem,pt 设备像素:也叫物理像素,显示设备上最微小的物理部件. 比如 iphone 5:640 x 1136px. 不同的机型有不同的设备像素,固定死的. 这里需要讲一下 ...
html 字号和像素的关系,一文搞懂CSS中的字体单位大小(px,em,rem...)
在学习的过程中,发现CSS有很多可以形容单位的尺寸.比方px,em,rem,vw等等.平常也没有深究,一来是没时间,二来是在我学习清单中优先级过低.一直想彻底弄明白,一直耽搁到现在.现在花上一点时间来 ...
html移动端怎么做城市选择,移动端页面单位的选择（px, em, rem, vw）
px, em, rem的区别: px:绝对字体大小 em:基于一个基数来计算出相对字体大小.(移动端用的少) rem:基于根节点(html)的字体大小来计算. vw:可视区宽度单位.1vw等于可视区宽 ...
css中的单位换算_css大小单位px em rem的转换和详解
css大小单位px em rem的转换和详解 PX特点 1. IE无法调整那些使用px作为单位的字体大小: 2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位: 3. Firef ...
移动端页面单位的选择(px em rem)
移动端页面单位的选择(px em rem) 绝对单位: px 相对单位: rem em em具有继承性继承自直接父类所以说在移动端很少用浏览器默认的字体大小 16px 那么 1em= ...

最新文章

热门文章