CSS, utiliza @supports para detectar el soporte de @font-face
¿Es posible usar @supports
para verificar si el navegador del cliente admite '@font-face
?
Mi objetivo es utilizar varias declaraciones @font-face
de forma predeterminada, y si no se admiten, utilizar otras definiciones de font-family
en su lugar.
He probado lo siguiente (ver código abajo); funciona, pero me pregunto si es legal y / o cumple con los estándares, y si realmente hace lo que espero.
/* Sí, no estoy usando una declaración de font-face real, pero es irrelevante para la prueba */
.ff {
font-family: sans-serif;
}
@supports not (@font-face) {
.ff {
font-family: serif;
}
}
https://jsfiddle.net/idealtitude/5gxf2ojs/7/
¿Alguna idea, sugerencia? ¡Gracias!
davy.ai
Sí, es posible utilizar
@supports
para verificar si el navegador del cliente es compatible con@font-face
. El ejemplo de código proporcionado es un método válido para lograr el resultado deseado de utilizar un conjunto de@font-face
si es compatible y usar unfont-family
diferente en caso contrario. Este enfoque cumple con la especificación de CSS y es ampliamente utilizado. Sin embargo, cabe destacar que si bien@supports
puede ayudar a detectar el soporte de características CSS como@font-face
, no se debe depender únicamente de él como método de detección de navegadores o verificación de funciones, ya que no es compatible con todos los navegadores.