尺寸小于12px,line-height无法设置居中

font-size有一个最小值12px,如果小于12px,一律按照12px处理,但是可能有时候真的有10px等等较小的设计

具体看blog.csdn.net/q121516340/…

1.用scale设置时将所有的值设置大一倍，然后缩小一倍

因为我们尺寸是2倍的,所以font-size: 20px;实际上是10px

.min-size-test {
  height: 36px;
  width: 200px;
  background-color: red;
  color: white;
  font-size: 20px;
  line-height: 36px;
}

测试

.min-size-test {
  height: 72px;
  width: 400px;
  background-color: red;
  color: white;
  font-size: 40px;
  line-height: 72px;
  transform: scale(0.5);
}

transform-origin: 0 0; // 必要的时候加上这个,一般是子元素左边有很大的空格