我有一个WordPress网站，我使用插件来创建一个画廊。
我创建了一个画廊并将其嵌入到我的网站中。
然而，图像描述的文本覆盖移动的上的整个图像大小。
如何使用内联CSS或其他方法根据设备动态更改标题的字体大小？
我现在有下面的内联代码，但它一直保持17px的大小。
<style scoped>
.on-the-fly-behavior{
font-size:17px;
}
@media (min-width:200px){
.on-the-fly-behavior{
font-size:15px;}
}
</style>
<div class="on-the-fly-behavior">My Image Caption<div>我希望标题的字体大小在Desktop/Laptops上为17px，在Mobile设备上为15px或更小。
1条答案
按热度按时间weylhg0b1#
尝试以下媒体查询，而不是当前的媒体查询：
上面的媒体查询会将所有宽度小于570px的设备的字体大小更改为15px（我使用了570px，因为一些大屏幕手机有这个大小。如果你愿意，你可以使用492px）。