Mvc: Crear un<link/> Tag Helper con soporte para fuentes de respaldo

Esta es la hoja de estilo CSS equivalente a # 1576

Un LinkTagHelper que permite que se cargue la especificación de una hoja de estilo alternativa en caso de que el primario no se cargue. La falla se determina inyectando una etiqueta <meta> ficticia con un nombre de clase específico ( asp-fallback-test-class atributo) y luego probando el estilo calculado de ese elemento para ver si una propiedad CSS especificada ( asp-fallback-test-property atributo) es igual a un valor especificado ( asp-fallback-test-value ).

Uso

<link href=""
      asp-fallback-href=""
      asp-fallback-test-class=""
      asp-fallback-test-property=""
      asp-fallback-test-value="" />

Todos los atributos deben estar presentes y no ser nulos para que funcione Tag Helper. Si falta alguno, registrará una advertencia y no operará.

Argumentos

| Nombre de atributo | Tipo | Detalles
| --- | --- | --- |
| asp-fallback-href | string | La URL a la que recurrir si falla la principal (como se especifica en el atributo href ) |
| asp-fallback-test-class | string | El nombre de clase definido en la hoja de estilo que se utilizará para la prueba de respaldo |
| asp-fallback-test-property | string | El nombre de la propiedad CSS que se utilizará para la prueba de reserva |
| asp-valor-de-prueba-de-respaldo | string | El valor de la propiedad CSS que se utilizará para la prueba de respaldo |

Ejemplo

Fuente CSHTML

 <link href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet"
       asp-fallback-href="~/lib/bootstrap/css/bootstrap.min.css"
       asp-fallback-test-class="hidden" asp-fallback-test-property="visibility" asp-fallback-test-value="hidden" />

HTML de salida

<link href="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" />
<meta name="x-stylesheet-fallback-test" class="hidden" />
<script>
    (function (a, b, c) {
        var d = document,
            s = d.getElementsByTagName("SCRIPT"),
            meta = s[s.length-1].previousSibling;
        (d.defaultView.getComputedStyle(meta)[a] === b ||
            d.write('\u003clink rel="stylesheet" href="' + c + '" /\u003e'));
    })("visibility", "hidden", "/lib/bootstrap/css/bootstrap.min.css");
</script>