预加载的媒体查询CSS不适用于Chrome中的调整大小
问题描述:
我试图在具有媒体属性的CSS链接上使用rel =“preload”。预加载的媒体查询CSS不适用于Chrome中的调整大小
和一切工作正常,除了在Chrome浏览器的媒体查询规则不适用于窗口大小调整。
这里是链接:
<link href="${URLUtils.staticURL('/css/main.css')}" as="style" onload="this.rel='stylesheet'" type="text/css" rel="preload">
<link href="${URLUtils.staticURL('/css/responsive-767px-max.css')}" as="style" media="screen and (max-width: 767px)" onload="this.rel='stylesheet'" type="text/css" rel="preload">
<link href="${URLUtils.staticURL('/css/responsive-768px-979px.css')}" as="style" media="screen and (min-width: 768px) and (max-width: 979px)" onload="this.rel='stylesheet'" type="text/css" rel="preload">
<link href="${URLUtils.staticURL('/css/responsive-980px-1199px.css')}" as="style" media="screen and (min-width: 980px) and (max-width: 1199px)" onload="this.rel='stylesheet'" type="text/css" rel="preload">
<link href="${URLUtils.staticURL('/css/responsive-1200px-min.css')}" as="style" media="screen and (min-width: 1200px)" onload="this.rel='stylesheet'" type="text/css" rel="preload">
我在Safari和Mozile测试了它,并在调整大小媒体查询规则工作得很好。它可以在Chrome中运行,无需rel =“preload”。
它是已知问题吗?