我正在第一个响应式网站上工作。我已阅读并对此有一个不错的理解。我遇到的问题之一是文本或h1-6标头。例如，我有一个要在调整浏览器大小时调整大小的按钮。该按钮在课程下。同样在那个css文件中，我有一个@media only屏幕，并且（min-width：320px）{...在括号内，我调用了同一类，并为宽度设置了max-width：50％。这完美。我遇到的问题是，如果我再次使用element，即使我全屏查看它，它也会替换整个页面。
我想说的是，例如，我在CSS内有一个名为“ keep-button”的类，我将其设置为font-size：25px。现在，当我进入@media only屏幕和（min-width：320px）{并将字体大小更改为15px时。它不会在整个320px屏幕上将字体大小更改为仅15px，而是对整个页面进行更改。我试过使用font-size-adjust，但这没用。
这是其中的示例代码：
.keep-button {
height: 70px;
width: 430px;
background-color: #C60;
margin: auto;
margin-top: 115px;
}
h5 {
font-size: 25px;
color: #FFFFFF;
text-align: center;
padding: 20px 0;
}
@media only screen and (min-width : 320px) {
.keep-button {
max-width: 50%;
}
h5 {
font-size: 15px;
font-size-adjust: .50;
}
}
最佳答案
我认为您需要将@media only screen and (min-width : 320px)更改为@media only screen and (max-width : 320px)。现在，当页面小于320像素时，您的规则将适用。另外，请尝试了解有关媒体查询的this文章。
关于html - HTML/CSS响应文本，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/32428449/