我正在研究一个Wordpress主题,我无法让我的媒体查询工作,尽管它被加载到页面中,路径正确,顺序正确。
我认为它与入队有关,但是当我查看生成的源代码时,我得到了这个:
<link rel='stylesheet' id='rfn-css' href='http://localhost:8888/wp-content/themes/rfn/style.css?ver=1.0.0' type='text/css' media='all' />
<link rel='stylesheet' id='medium_large_down-css href='http://localhost:8888/wp-content/themes/rfn/mediumLarge.css' type='text/css' media='screen and (max-width: 1200px)' />
所以带有媒体查询的人在主要样式之后出现,并且链接是正确的,并且.css文件中的内容应该覆盖屏幕1200及以下的主要样式。
但是,它没有加载。
而且我知道这不是特异性或其他一些风格压倒它的结果。通常情况下,浏览器中的开发工具会通过交叉项目向我显示,就像在其他示例中一样:
但是在我现在正在研究的网站上,它就像第二张样式表甚至不存在......尽管事实上它在代码中被列为链接。
值得注意的是,当我删除指定screen and (max-width: 1200px)
的媒体查询部分时,它会起作用并且会读取样式。 (当然,在所有屏幕尺寸上,这都是不可取的。)
如果重要,将样式表添加到页面的过程如下:
add_action( 'wp_enqueue_scripts', 'rfn_equeue_styles' );
function rfn_equeue_styles() {
wp_register_style( 'medium_large_down', get_stylesheet_directory_uri() . '/mediumLarge.css',null,null,'screen and (max-width: 1200px)' );
wp_enqueue_style( 'medium_large_down' );
}
有什么建议吗?有什么理由不应该在运行MAMP的本地主机服务器上工作(我是)?