CSS中常用的4种长度单位

在现实生活中，我们知道很多的长度单位，例如米，厘米，寸，尺等等，在css的世界中，也有很多的长度单位

以下是css中常用的四种常用的长度单位

1，像素 px

- 像素是我们在网页中使用的最多的一个单位，一个像素就相当于我们屏幕中的一个小点，我们的屏幕实际上就是由这些像素点构成的，但是这些像素点，是不能直接看见。

- 不同显示器一个像素的大小也不相同，显示效果越好越清晰，像素就越小，反之像素越大。

2，百分比 %

- 也可以将单位设置为一个百分比的形式，这样浏览器将会根据其父元素的样式来计算该值

- 使用百分比的好处是，当父元素的属性值发生变化时，子元素也会按照比例发生改变

- 在我们创建一个自适应的页面时，经常使用百分比作为单位

3,em

- em和百分比类似，它是相对于当前元素的字体大小来计算的

- 1em = 1font-size，浏览器默认字体大小是16px

- 使用em时，当字体大小发生改变时，em也会随之改变

- 当设置字体相关的样式时，经常会使用em

4,rem

-rem是相对于根元素(html)的字体大小来计算的
代码演示