我对css媒体查询有几个问题。
予。两个css文件(例如normal.css和lessthan1024.css)是否必须包含所有css规则?或者可以仅仅包含不同的规则吗?
II。它是否适用于浏览器调整大小?或者页面是否必须刷新?
由于
答案 0 :(得分:2)
我。让我们说你想要一个蓝色背景的标题,无论分辨率如何。如果您在lessthan1024.css
文件中仅包含不同的内容,则表示标题的蓝色背景不会小于1024px。那么在这种情况下你认为你的问题的答案是什么?
II。它适用于调整浏览器窗口的大小。没有刷新。
话虽如此,我相信它可能会更好:
予。使用移动优先方法 - 这意味着您从最小的显示尺寸开始作为常态,然后开始调整页面的外观以获得更大的显示
II。使用@media
规则将所有显示大小的CSS放在一个文件中;例如:
/* base styling: common rules + smallest display rules*/
@media only screen and (min-width: 35em) {
/* adjust style for larger display */
}
我认为这更好的原因是因为......好吧,如果你使用2 .css文件,那么你会有一些重复的规则。假设您想要更改其中一些。您必须在2个地方进行相同的更改。也许你忘记在一个文件中进行更改。或者你可能不记得你在一个文件中设置了1em的填充,而在另一个文件中将它设置为2em。