Mobile Bootstrap Carousel - 字体大小调整

Question

我已经向我正在处理的网站添加了一个简单的 bootstrap 4 轮播，并且轮播本身正在正常工作。

当我在我的移动设备 (Galaxy S8+) 上检查网站并向下滚动到引导轮播时，字体大小最初是正确的，但当我滚动浏览每个轮播项目时字体会变大。

我的问题是，手机屏幕分辨率或像素密度是否会导致此问题？我还在 Iphone4 和 Iphone7 上查看了该网站，字体没有放大，这是我想要的。

我有调整段落高度的媒体查询，因此当用户滚动到不同的轮播项目时容器不会调整大小

@media screen and (max-width: 1200px) {
    .testimonial-text {
        min-height: 185px;
    }
}

@media screen and (max-width:991px) {
    .testimonial-text {
        min-height: 215px;
    }
}

@media screen and (max-width:767px) {
    .testimonial-text {
        min-height: 215px;
        width: 100%;
    }
}

@media screen and (max-width:522px) {
    .testimonial-text {
        min-height: 240px;
    }
}

@media screen and (max-width:456px) {
    .testimonial-text {
        min-height: 265px;
    }
}

@media screen and (max-width:413px) {
    .testimonial-text {
        min-height: 315px;
    }
}

@media screen and (max-width:368px) {
    .testimonial-text {
        min-height: 375px;
    }
}

这是一个用于推荐的轮播，我使用的段落标签的字体大小设置为 16 像素，就像我之前所说的 - 最初，在移动到第二个轮播项目之前，字体大小看起来是正确的。一旦我移动到下一个轮播项目，字体大小就会增加几个像素。在轮播项目过渡之间，字体大小看起来是正确的，但是一旦过渡停止，字体大小就会跳回。一旦轮播被实例化，它就会保持这种状态。

重申这仅在我的移动设备上。

jsfiddle - https://jsfiddle.net/a92ys80v/20/

提前感谢您的任何意见。我也很乐意提供更多信息。

Answer 1

我不清楚你想要什么，但如果你想减小字体大小或为移动/设备提供任何样式，你可以为该设备宽度编写媒体查询，如下所示

@media screen and (min-width: 480px) {
    body {
        background-color: lightgreen;
    }
} 

欲了解更多信息，请访问here