为每种屏幕尺寸修复@media查询/ @media代码
为每种屏幕尺寸修复@media查询/ @media代码
提问于 2015-05-05 04:32:18
要修复的网站问题：
我正在尝试弄清楚为什么我的一些@media查询是重叠的。如果你看我的代码，你可以看到@media查询是为每个设备维度标记的。
@media SCREEN SIZE: MASSIVE
@media SCREEN SIZE: LARGE
@media SCREEN SIZE: MEDIUM
@media SCREEN SIZE: IPAD
@media SCREEN SIZE: SMALL TABLET其目标是能够针对每种独特的@media /屏幕大小更改字体大小和图像大小。
问题:由于某些原因，当我在“screen SIZE: MEDIUM”上更改图像大小或文本大小时，它也适用于所有其他@media较大屏幕尺寸的更改。
但是，我可以为每个单独的@media代码单独更改标题背景“# header { background :url(../img/super)”，而不会错误地更改所有@media /屏幕大小的背景。
如何才能让css @media代码对它自己的@media /屏幕大小完全唯一，而不影响其他@media /屏幕的大小？
我如何为小尺寸的手机添加最终的@media (网站目前在小尺寸的手机上显示全部混乱)？
让我知道答案。祝你一切顺利！
回答 1
Stack Overflow用户
发布于 2015-05-05 04:59:23
如果您需要非重叠断点，则必须执行以下操作
/*Small*/
@media (max-width: 499px) { ... }
/*Medium*/
@media (min-width: 500px) and (max-width: 999px) { ... }
/*Big*/
@media (min-width: 1000px) and (max-width: 1499px) { ... }
/*Large*/
@media (min-width: 1500px) { ... }页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30039449
复制相关文章
相似问题
腾讯云开发者
