px,em,rem介绍与区别
程序员文章站
2022-06-10 14:10:00
...
px
1.px是绝对单位,是你屏幕设备物理上能现实出的最小的一个点,这个点不是固定的,比例有可能会不同。假设;你现在用的显示器1px宽=1毫米,但我用的显示器1px宽=两毫米,那么我定义一个div为100px,你显示器上看div是10厘米,我显示器上看是20厘米,另外一个px点的长宽不一定是1:1的正方形,有的设备的长宽比试不一样的。
em
是相对单位,所有浏览器下默认字体尺寸是16px,然后人为的把body里面定义font-size:12px;那么其他元素会根据这个父元素调整自己的大小,em的用处是你要整个网页字体统一变大变小。
举例:
body{
font-size:16px;
}
p{
font-size:0.75em;
}
span{
font-size:2em;}
//相对于p标签来说,它的是0.75*16,
//相对于span标签来说,0.75*16*2
rem
em相对单位,他只针对html,body的字体尺寸,没有了继承父级尺寸的这个关系。
区别
1.px是固定长度单位,不会随其他元素的变化而变化
2.ex是相对单位,会随父级元素的属性变化而变化
3.rem是相对单位,所有它会随html元素的实行变化而变化
4.一般来说,1em=16px
上一篇: Oracle RAC下添加静态注册监听器listener
下一篇: Android Studio移动应用开发——Android NDK开发(含:javah -jni、ndk-build配置出错的解决办法)
推荐阅读
-
Lua中关于求模与求余的区别介绍
-
php中explode与split的区别介绍_PHP
-
css 单位px、em、rem、vh、vw、vmin、vmax区别
-
华为手环b6和b5哪个值得入手 华为手环b6与b5的区别介绍
-
PHP中file_exists与is_file,is_dir的区别介绍
-
jquery 层次选择器siblings与nextAll的区别介绍_jquery
-
css中的px、em、rem、pt 特点和区别及换算
-
php循环语句 for()与foreach()用法区别介绍_PHP
-
php循环语句 for()与foreach()用法区别介绍_php技巧
-
jquery prop的使用介绍及与attr的区别_jquery