更改 CSS 样式

Question

我有一个由主 CSS 样式文件生成的元素。 HTML部分是：

<div class="footerLine"></div>

开发者工具中的样式显示：

@media (min-width: 1919px)
.footer .footerLine {
    background: url(footer.png) no-repeat 35px bottom;
    background-size: auto 86px;
    width: 100%;
    height: 250px;
}

在开发人员工具中更改 height 实际上会按我的意愿更改高度，但是当更改 CSS 本身的高度时，没有任何反应，所以我认为我做错了什么。

我想做的是：

@media screen and (min-width: 1919px)
{
   .footerLine
   {
       height:  50px;
   }
}

我什至在没有 media screen 的情况下尝试过，但也没有成功。

Answer 1

有 css 层次结构，当你在一个选择器中使用 2 个类，在另一个选择器中使用 1 个类（但针对同一元素），那么这个有 2 个类的选择器更强。

更多信息在这里：https://specificity.keegan.st/

你需要写：

@media screen and (min-width: 1919px){
  .footer .footerLine {
    background: url(footer.png) no-repeat 35px bottom;
    background-size: auto 86px;
    width: 100%;
    height: 250px;
}

然后：

@media screen and (min-width: 1919px){
  .footer .footerLine {
    height: 50px;
  }
}