html - CSS 媒体查询更改

Question

我有几个关于 CSS 媒体查询的问题。

I. 两个 css 文件（例如 normal.css 和 lessthan1024.css）是否必须包含所有 css 规则？或者 lessthan1024.css 可以只包含不同的规则吗？

二、它适用于浏览器调整大小吗？还是必须刷新页面？

谢谢

score 2 · Accepted Answer

I.假设您想要一个带有蓝色背景的标题，无论分辨率如何。如果您在lessthan1024.css文件中仅包含不同的内容，则意味着您不会有小于 1024 像素的标题的蓝色背景。那么在这种情况下，您认为您的问题的答案是什么？

二、它适用于调整浏览器窗口的大小。没有刷新。

话虽如此，我相信这样做可能会更好：

I. 使用移动优先的方法 - 这意味着您从最小的显示尺寸开始作为标准，然后开始调整页面的外观以适应更大的显示

二、使用规则将所有显示尺寸的所有 CSS 放在一个文件中@media；例子：

/* base styling: common rules + smallest display rules*/

@media only screen and (min-width: 35em) {
    /* adjust style for larger display */
}

我认为这更好的原因是因为......好吧，如果您使用 2 个 .css 文件，那么您将重复一些规则。假设您想更改其中的一些。您必须在 2 个地方进行相同的更改。也许您忘记在一个文件中进行更改。或者您可能不记得您在一个文件中将填充设置为 1em，而在另一个文件中将其设置为 2em。

1 回答 1