我使用这段代码在第二个 html 页面上进行了完美的媒体查询
@media only screen and (min-device-width: 200px) and (max-device-width: 1099px) {
.snebild img {
width: 50%;
max-width: 50%;
right: 2%;
}
.title {
margin-left: 4%;
position: absolute;
top: 10%;
}
}
但在我的第二页上,我试图更改字体大小,使其在较低分辨率下看起来不错,但使用相同的代码只是更改为正确的类和 p 元素,但没有任何效果。
@media only screen and (min-device-width: 200px) and (max-device-width: 1099px) {
.introus p {
font-size: 8px;
}
}
这是HTML
<div class="introus">
<h2>Main Title</h2>
<h4>Second title</h4>
<p>Text to change size on when using lower resolution such as Iphones</p>
</div>
最佳答案
我假设您是在桌面设备而不是移动设备上测试它。
尝试将 min-device-width
更改为应该有效的 min-width
。
如果我错了,请纠正我。
关于html - 媒体查询有问题,没有任何反应,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41301332/