css - 媒体查询不会覆盖标签样式

Question

我想覆盖 h1 标签的 font-size，但它不会这样做 我对 h1 标签有一些规范，但不是因为它的字体大小:

#carousel-index .carousel-inner .item .slide_info h1 {
    color: #005e9c;
    font-weight: 300;
}

对于字体大小我有这个

h1, .h1 {
    font-size: 36px;
}

这是我的媒体查询

@media (max-width: 1224px){
    h1{
        font-size:30px;
    }
}

但它仍然是 36px 而不是 30px

Answer 1

您的媒体查询必须遵循“标准”规则:

h1, .h1 {
    font-size: 36px;
    color: blue;
}

@media (max-width: 1224px){
    h1{
        font-size:30px;
        color: red;
    }
}    

查看这个 jsfiddle: https://jsfiddle.net/ej6phmj1/