浏览器以不同的方式呈现相同的CSS文件

时间:2018-12-11 17:00:33

标签: html css

从npm加载css文件与从cdn加载时我遇到问题。

使用下面的CDN,我可以呈现表单而没有任何问题。

<link rel='stylesheet' href='https://unpkg.com/formiojs@latest/dist/formio.full.min.css' />
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/formiojs@3.9.3/dist/formio.full.min.css' />

但是当我从本地CSS文件呈现表单时,表单呈现不正确

<link rel='stylesheet' src="/lib/formiojs/dist/formio.full.min.css" asp-append-version="true"/>

您可以看到区别here

在浏览器中打开2个文件并粘贴到diff工具中,我注意到差异似乎位于'×'左右,位于2个地方。

在文本编辑器中打开这两个文件时,它们是相同的。

在浏览器中,CDN将字符串呈现为'×',而npm文件则呈现为'×'

如何使用'×'加载CSS文件?

我尝试将charset="UTF-8"添加到link元素中,但仍无法正确呈现。 我认为这与编码有关。

有问题的文件可以在这里找到 https://github.com/formio/formio.js/blob/master/dist/formio.full.css

1 个答案:

答案 0 :(得分:0)

这可能是一个错字,但您可以尝试替换

<link rel='stylesheet' src="/lib/formiojs/dist/formio.full.min.css" asp-append-version="true"/>

<link rel='stylesheet' href="/lib/formiojs/dist/formio.full.min.css" asp-append-version="true"/>

使用的关键区别是href,而不是src