我想制作一个使用rem单元的移动第一个网站，但有些问题我无法解决 .

这是我的设定：

EM media queries

和

html {
  font-size: 14px; // base font size
}

@media (min-width: 62em) { // i need all of the element scale when min-width is 62em
  html {
    font-size: 16px;
  }
}

body {
  font-size: 1rem;
}

.element {
  border-width: 0.0625rem; // 1px border
  padding: .5rem 1rem; // rem padding
}

我的问题是

  • 当放大到> 110％时，62em媒体查询会更改，而html字体大小又回到基本14px，任何方法都可以解决吗？

  • 缩小时，0.0625rem边框消失，因为它的<1px，所以如果任何样式是1px，那么不应该使用rem吗？怎么样1.5px或2px？

  • 我读了一些文章，建议不要改变html字体大小，只留下100％，如果我按照这个方法并需要得到相同的结果上面的例子，我需要使用sass mixin来计算所有的css样式与不同媒体查询中14px基本字体大小和16px基本字体大小？

css sass