html - 更改 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，但也没有成功。

标签： htmlcssangular

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;
  }
}