炼金中...

幸运兔脚

【笔记】CSS布局单位
简介在CSS布局中,长宽高等参数有着举足轻重的地位,对于这些参数,他们有着不同的单位,使用效果也有很大差别。pxp...
扫描右侧二维码阅读全文
25
2018/12

【笔记】CSS布局单位

简介

在CSS布局中,长宽高等参数有着举足轻重的地位,对于这些参数,他们有着不同的单位,使用效果也有很大差别。

px

px就是pixel的缩写,意为像素。像素是计算机画面的最小单位,通常这个值是非常固定的,即使画面比例发生变化,对于使用了像素值的参数效果也不会有影响。
优点:固定,不管什么情况下效果都是一致的。
缺点:缺乏弹性,不管什么情况效果都不会改变导致的效果没有弹性。

em

em是一个相对的大小,他的参考物是父元素的font-size,也就是说,使用em的时候,子栏目都是根据他的父级栏目的字体大小设置的。

rem

rem是CSS3新增的一个相对单位。
相对长度单位。相对于根元素(即html元素)font-size计算值的倍数。
这个没用过,更具体的就不太了解了。

%

相对于父元素宽高的百分比。

vh

css3新增单位,view height的简写,是指可视窗口的高度。简单说就是窗口高度的百分比,假设窗口高1000px,那么10vh就是100px。

其他似乎不太常用的单位

  • in 英寸
  • cm 厘米
  • mm 毫米
  • ex 一个 ex 是一个字体的 x-height。 (x-height 通常是字体尺寸的一半。)
  • pt 磅 (1 pt 等于 1/72 英寸)
  • pc 12 点活字 (1 pc 等于 12 点)
Last modification:December 25th, 2018 at 01:00 pm
If you think my article is useful to you, please feel free to appreciate

Leave a Comment