.NET LinkTagHelper - 如何在没有显式 css 类选择器的情况下将其用于 CSS CDN 文件？答案

【问题标题】：.NET LinkTagHelper - how can I use it for CSS CDN files without explicit css class selectors?.NET LinkTagHelper - 如何在没有显式 css 类选择器的情况下将其用于 CSS CDN 文件？
【发布时间】：2018-09-22 02:17:47
【问题描述】：

我有一个 .NET Core 2.1 应用程序，其中我通过“LinkTagHelper”.NET 帮助程序从 CDN 提取一些资源。

我从一个明显的例子开始（效果很好），如下所示：

    <link rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css"
      integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO"
      crossorigin="anonymous"
      asp-fallback-href="~/lib/dist/css/bootstrap.min.css"
      asp-fallback-test-class="sr-only"
      asp-fallback-test-property="position"
      asp-fallback-test-value="absolute" />

现在一切都很好，Fallback 工作（如果需要）CSS“sr-only”类已经过测试是否存在和正确性。

我也在尝试在他们的 CDN 上为这个 CSS 文件做同样的事情：

    <link rel="stylesheet"
      href="https://cdn.datatables.net/1.10.19/css/dataTables.bootstrap4.min.css"
      integrity="sha384-EkHEUZ6lErauT712zSr0DZ2uuCmi3DoQj6ecNdHQXpMpFNGAQ48WjfXCE5n20W+R"
      crossorigin="anonymous"
      asp-fallback-href="~/lib/dist/css/dataTables.bootstrap4.min.css"
      asp-fallback-test-class=".dataTable"
      asp-fallback-test-property="clear"
      asp-fallback-test-value="both" />

现在在上面的例子中，测试 css 类、属性和值选项是错误的——它们不起作用，所以总是加载后备。我想知道是不是因为在dataTables css文件（here is the un-minified version）中，没有指定“仅类”选择器，它们都是类型+类。

所以，我怀疑我不能在这里做我想做的事，因为我无法选择合适的 CSS 选择器在 LinkTagHelper 中使用！如果它总是要回退，那我还不如没有CDN。

我是在使用 LinkTagHelper 错误，还是没有正确考虑这个问题？

（我知道我总是可以从我的站点加载它，而不必为这些恶作剧而烦恼，但是……如果我正在为一个库做 CDN，那么最好保持一致）。

【问题讨论】：

标签： html css .net asp.net-core-2.0

【解决方案1】：

现在在上面的示例中，测试 css 类、属性和值适当的选项是错误的 - 它们不起作用，所以后备是总是加载。我想知道是不是因为在dataTables css文件中（这里是未缩小的版本），没有“仅类”选择器指定，都是类型+类。

所以，我怀疑我不能在这里做我想做的事，因为我无法选择在 LinkTagHelper 中使用的适当 CSS 选择器！如果它是总是要后退，那我还不如没有CDN。

我继续查看 source code 以了解使用帮助程序时实际发生的情况。

如果你跟着源码看，你会看到帮助器基本上是在添加

带有原始 CSS 文件的 link 标记
meta 标记，其类属性设置为 asp-fallback-test-class 属性中指定的值
最后，它添加了一个脚本来验证 asp-fallback-test-property 元元素的样式值是否与 asp-fallback-test-value 相同或不是。如果值不同，它会在 asp-fallback-href 中指定的 CSS 文件中添加另一个 link。

对于您的情况，css 文件在 CSS 中包含带有一些标签（table.dataTable）的所有选择器，因此根据我的理解，很难确定 CSS 文件是否已加载，并且总是会导致回退 CSS 文件。

您可以通过here关注原始功能请求。

我是在使用 LinkTagHelper 错误，还是没有正确考虑这个问题？根据我的理解，你不是，只是你的情况是一个边缘情况，如果你愿意的话。

最后，您的问题中asp-fallback-test-class=".dataTable" 的一个小改动应该是asp-fallback-test-class="dataTable"（没有。）。

【讨论】：