如何针对特定的缩放级别调整CSS？

@media screen and (max-width: 600px) {
  /* 在缩放级别小于等于600px时应用的样式 */
  /* 可以在这里调整元素的大小、位置、字体大小等 */
}

@media screen and (min-width: 601px) and (max-width: 1024px) {
  /* 在缩放级别在601px和1024px之间时应用的样式 */
  /* 可以在这里调整元素的大小、位置、字体大小等 */
}

@media screen and (min-width: 1025px) {
  /* 在缩放级别大于等于1025px时应用的样式 */
  /* 可以在这里调整元素的大小、位置、字体大小等 */
}

.element {
  transform: scale(0.8); /* 缩放比例为0.8 */
}

.text {
  font-size: 16px; /* 默认字体大小 */
}

@media screen and (max-width: 600px) {
  .text {
    font-size: 14px; /* 在缩放级别小于等于600px时的字体大小 */
  }
}

@media screen and (min-width: 601px) and (max-width: 1024px) {
  .text {
    font-size: 18px; /* 在缩放级别在601px和1024px之间时的字体大小 */
  }
}

@media screen and (min-width: 1025px) {
  .text {
    font-size: 20px; /* 在缩放级别大于等于1025px时的字体大小 */
  }
}