css - 移动优先媒体查询不会覆盖原始 CSS

Question

假设我有这个:

.about_text {
  font-weight: 300;
  font-size: 1.125rem;
}

并且:

@media screen and (min-width: 64em) {
    .about_text {
        font-weight: 600;
        font-size: 1.500rem;
    }
}

如果我不使用 !important，它不会覆盖原来的 CSS...为什么会这样呢？我在 Wordpress 网站上使用 LESS，但我已经做过无数次了，而且以前从未发生过。我负责处理原始 CSS 之后的媒体查询。

Answer 1

如果您希望媒体查询使用 css 样式，请尝试对媒体查询使用级联，如下所示 -

   @media screen and (min-width: 64em) {
    div .about_text {
       font-weight: 600;
       font-size: 1.500rem;
       }
     }