重置媒体查询中的CSS

Question

假设我有媒体查询..

@media only screen and (min-width: 960px) {
 /*STYLE HERE */
}

是否可以在此媒体查询中重置CSS，以便其中的所有元素都不会从默认样式表中接收样式？

非常感谢帮助!!

Answer 1

如果您想实现这样的功能，请使用查询加载样式表：

<link rel='stylesheet' media='screen and (max-width: 959x)' href='mobile.css' />
<link rel='stylesheet' media='screen and (min-width: 960px)' href='desktop.css' />

我不建议你有两个不同的样式表和重复的样式/布局，因为在一个更大的项目中管理起来会非常困难。

相反，我建议使用移动的第一个主样式表（或查询），您可以在其中应用基本的移动布局，颜色和样式等。然后，您可以为其余的工作表/查询（平板电脑 - >桌面）编写布局。大多数情况下，查询都需要简单的列调整和一些填充/边距，字体大小等，因此大多数主要样式都可以在任何地方使用。