单位

什么是像素单位

• 什么是像素单位，单位是用来做长度的计量的。例如我们使用米/ 厘米/ 毫米等
• 那在 css 的世界中 我们一般用什么做计量单位的呢。是固定单位 px/ 百分比单位%/ 相对单位 em/ rem

像素单位 px

• 固定单位
• 其实我们电脑看到画面是由一个一个的小点点做成。这个点点就是像素
• 可以理解为电脑的分辨率是多少，那么画面就是多个小点点做成
• 虽然可以设置同样的像素，但是不同的设备。表示大小不同。因为设备可以进行缩放

百分比单位 %

• 百分比单位
• 同样我们可以将单位设置为百分比
• 单位的百分比 宽度相对于父类的宽度而言。高度相对于父类的高度而言
• padding 内边距设置百分比 是相对于父类的宽度而言的
• margin 外边距设置百分比 是相对于父类的宽度而言的

• 注：如果父类没有设置高度，但是祖父类设置高度了。也是参照父类的高度而言

相对单位 em

• 相对单位
• 是相对于元素上作用的 font-size 而言的。例如元素设置 1em 宽度。如果此时 font-size 是 16px 的话，那么真正的宽度就是 16px

相对单位 rem

• 相对单位
• 是相对于 html 根节点的 font-size 而言的。跟 em 单位的计算方式略有不同