媒体查询无法在Chrome中工作,在Firefox(Media Queries not workin

2019-10-29 14:09发布

我有特定于许多不同的分辨率样式的整个范围。 我将它们链接使用的标题,引用如:

<link rel="stylesheet" media="(min-width: 1024px) and (max-width: 1024px)" href="http://site.com/child-theme/1024.css" />

在Firefox中,他们顺利工作,但在Chrome中(也可能是Safari浏览器),它不接受媒体查询,即使它清楚地检测/看见它们,因为它们在Firebug可见,但它们划掉。

不能为我的生命数字出来......任何解决这一难题的帮助,将不胜感激!

我的(WordPress的)网站是: HBB-Inc.com要查看它应该是什么样子,看看在Firefox ...然后在Chrome比较。

Answer 1:

这是因为CSS的性质,代表C ascading 小号 tyle 小号 heets。

在这一份修正报价从一些互联网上的地方:

级联是特殊的一部分。 一个样式表的目的是通过一系列的样式规则级联,像一条河流过瀑布。 河里的水打所有的岩石在瀑布,但只有那些在底部影响究竟在何处水会流动。 同样是在样式表级联的真实。

换句话说,因为你的media="all"样式表链接下倒在你的头一节他们影响你刚才在这个过程中风格非常相同的元素的外观。

我认为移动样式表与他们的media属性设置为all你的头节将解决您的问题的开始



文章来源: Media Queries not working in Chrome, works in Firefox