px_em_rem

px_em_rem

• px
  px是固定的像素，一旦设置了就无法因为适应页面大小而改变。
• em和rem
  em和rem相对于px更具有灵活性，他们是相对长度单位，意思是长度不是定死了的，更适用于响应式布局；就是说当父元素大小发生变化，相应的字体大小也会发生变化，而不是一直都是某个px大小。
  对于em和rem的区别一句话概括：em相对于父元素，rem相对于根元素(rem中的r理解为root)。
  • em
    子元素font-size的em是相对于父元素font-size大小；
    元素的width/height/padding/margin用em的话是相对于该元素的font-size
  • rem
    当用rem做响应式时，直接在媒体中改变html的font-size那么用rem作为单位的元素的大小都会相应改变，很方便。

在做项目的时候用什么单位长度取决于需求，一般是：
像素（px）：用于元素的边框或定位。
em/rem：用于做响应式页面，不过我更倾向于rem，因为em不同元素的参照物不一样（都是该元素父元素），所以在计算的时候不方便，相比之下rem就只有一个参照物（html元素），这样计算起来更清晰。