我有一个网页，当它的 URL 以 http://开头或在未指定协议时默认为 http 协议时，它工作正常，但错误并显示一条消息，指出当网页的 URL 以 https：//开头时找不到主.css文件。
最新版本的Chrome浏览器检查控制台显示错误发生在指定主样式表文件的行中.css：
<link rel="stylesheet" type="text/css" media="screen" href="/Resources/public/css/main.css" />
使用 Chrome inpect 工具，我发现从 fonts.googleapis.com 导入字体的主文件中.css两行似乎是问题所在，因为它们的 URL 以 http://开头并导致混合内容错误，因此浏览器会阻止主.css文件。 以下是几行：
@import url(http://fonts.googleapis.com/css?family=Roboto|Alex+Brush);
@import url(http://fonts.googleapis.com/css?family=Asul);
当我将这两个 URL 更改为以 http s：//开头时，当页面的 URL 以 https：//或 http://开头时，所有错误都会消失。
问题：由于我的页面打算在任一协议中使用，因此在 main.css 文件中是否有一种方法可以使用脚本或某些 css 机制根据链接主样式表的页面使用的协议在 https和 http 协议之间切换.css？像下面这样说伪代码：
*IF protocol is https then*
@import url(https://fonts.googleapis.com/css?family=Roboto|Alex+Brush);
@import url(http**s**://fonts.googleapis.com/css?family=Asul);
*ELSE*
@import url(http://fonts.googleapis.com/css?family=Roboto|Alex+Brush);
@import url(http://fonts.googleapis.com/css?family=Asul);
*ENDIF*
我说在里面是因为我不想创建两个版本的主.css文件，每个协议一个，我也不想将这些行分解成单独的样式表文件并以某种方式链接它们。
我不确定为什么你想在https可用时通过http加载字体，但简单地发出协议对你有用，因此只需更新到：
@import url(//fonts.googleapis.com/css?family=Roboto|Alex+Brush);
@import url(//fonts.googleapis.com/css?family=Asul);