相关疑难解决方法(0)

花哨的媒体查询与少数魔术

在一些css类中使用less来为不同的分辨率包装css样式会很不错.

我想做点什么:

footer {
  width: 100%;
}

.tablet {
  footer {
    width: 768px;
  }
}

.desktop {
  footer {
    width: 940px;
  }
}
Run Code Online (Sandbox Code Playgroud)

最后这样的结果应该是结果:

footer {
  width: 100%;
}

@media screen and (min-width: 768px) {
  footer {
    width: 768px;
  }
}

@media screen and (min-width: 992px) {
  footer {
    width: 940px;
  }
}
Run Code Online (Sandbox Code Playgroud)

.tablet可能看起来像这样:

@media screen and (min-width: 768px) {
  .tablet {

  }
}
Run Code Online (Sandbox Code Playgroud)

希望有人有个好主意!

css3 less media-queries responsive-design

79
推荐指数
5
解决办法
5万
查看次数

标签 统计

css3 ×1

less ×1

media-queries ×1

responsive-design ×1