Html CSS/引导-是否有任何方法可以避免这种冗余？

我需要根据查看端口更改字体大小，因为我正在使用以下代码；然而，我觉得这有点多余和不专业。我认为，这应该是实现同样结果的更好办法

另外，我正在使用Bootstrap 4

---

这些字体大小背后是否有一个公式，或者您是否出于某种原因选择了它们？为什么不使用

vw

或

vh

单位-根据视口更改字体大小（您可以从单位名称看出）。但是，看起来你的大小会随着屏幕的大小而变化，而这些大小只是随机的，唯一的方法就是你这样做。你知道BS4已经包括了吗？@SalmanA我选择了字体大小来根据屏幕大小变化，这是唯一的原因，从我得到的结果来看，这样做是最好的；然而，由于某种原因，它对我不起作用，似乎它甚至没有点火

@media (min-width: 0px) and (max-width: 500px) {
.block {
 font-size: 5.1em !important;
 }
 } 

@media (min-width: 501px) and (max-width: 800px) {
.block {
 font-size: 6.1em !important;
 }
}

 @media (min-width: 801px) and (max-width: 1100px) {
.block {
  font-size: 4.8em !important;
}
}

 @media (min-width: 1101px) and (max-width: 1300px) {
 .block {
   font-size: 5.5em !important;
  }
 }

 @media (min-width: 1301px) {
  .block {
  font-size: 6em !important;
  }
 }