2013-05-20 82 views
0

我有一系列特定于许多不同分辨率的样式表。 我链接到他们在头中的引用,如:媒体查询不适用于Chrome,适用于Firefox

<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中进行比较。

+0

你试图对所有属性使用双引号(“),而不是混合单引号(' )和双重? – Giona

+0

尝试使用所有双引号,但问题仍然存在。根据Firebug浏览器(Chrome)清楚地检测到应该应用的媒体查询样式表,但是CSS本身被划掉,转而使用主样式表 – user2400304

回答

0

这是因为CSS的性质,它代表了çascading小号tyle小号heets

的这一修改报价从一些互联网上的地方:

级联是特殊的一部分。样式表旨在通过一系列样式规则级联 ,如瀑布上方的河流。河流中的水会冲击瀑布中的所有岩石,但只有底部的水才会影响水的流动位置。样式表中的级联同样是 。

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

我觉得跟他们media属性设置为all你的头段的开始将解决您的问题,移动样式表

+0

好吧,似乎已经把我带到了某个地方......但是问题依然存在,在将媒体属性设置为全部高于其余的样式表之后,Chrome已经将正确的(相关的)样式表高于另一个(并且未交叉),但是即使主样式表规则被删除,它仍然在使用他们的规则。 – user2400304

+0

我不是很精通媒体查询,但你看起来有点奇怪,如果你指定一个样式表与媒体查询'(min-width:1024px)和(max-width: 1024px)'那个样式表只会在宽度恰好为1024px时才被应用?所以在你的情况下,媒体查询不会仅仅在1024px,1152px,1280px等等的情况下工作,并且在它们之间的任何宽度上,它们只会回落到你的'media =“all”'样式表中? –

+0

是的,这是我的目标看到,因为我使用的主题/布局,它需要调整几乎所有不同的宽度,看起来是一样的。 – user2400304

相关问题