任何人都可以看到为什么这个媒体查询不起作用? CSS .header-x1的第一部分工作正常。但我想在最大宽度为768px时更改字体大小。但是当我在这里运行代码时没有任何反应。谁能明白为什么?
<p class="header-xl">
This is a test
</p
.header-xl {
font-weight: 900;
font-size: 5em;
line-height: 1;
text-transform: uppercase;
color: #fff;
padding-top: 160px;
}
@media(max-width:768px) {
header-xl {
font-size: 8px;
}
答案 0 :(得分:4)
你错过了。对于媒体查询中的类,而不是header-xl add .header-xl
@media(max-width:768px) {
.header-xl {
font-size: 8px;
}
答案 1 :(得分:0)
从外观来看,媒体查询中需要.header-xl
而不是header-xl
答案 2 :(得分:0)
将header-xl
更改为 .header-xl
@media(max-width:768px) {
.header-xl {
font-size: 8px;
}
}