¿Cuáles son los pros y los contras de CSS @import en comparación con en HTML?

Según SitePoint [1] y otros [2], existen bastantes problemas con @import en IE <= 8, especialmente cuando se trata de incluir un tipo de medio (pantalla, impresión, etc.).

Además de este problema técnico, rara vez uso @import porque generalmente la cantidad de código importado aquí (como lo hizo otra solicitud al servidor) podría justificar una “inclusión” real, como lo hacen, por ejemplo, herramientas como SASS y LESS.

También existe el caso de uso del manejo del estilo de características: si, por ejemplo, tiene una funcionalidad que se limita a un puñado de páginas, es posible que desee (dependiendo de la cantidad de estilo personalizado allí) agregar esto a una hoja de estilo separada y luego cárguelo solo en estas páginas. Para esto, necesita un adicional si desea mantener todas las ventajas de almacenamiento en caché.

[1] http://reference.sitepoint.com/c…
[2] http://www.broken-links.com/2007…

El uso de @import tiene una serie de problemas que incluyen el bloqueo del renderizado progresivo en algunas versiones de IE, la descarga en orden aleatorio y otros.

En lugar de reescribir mal, otros lo han explicado tan bien que el siguiente artículo podría interesarle:

http://www.stevesouders.com/blog

Su apuesta más segura es no usarlo en la producción. Sin embargo, en el modo de desarrollo puede hacerte la vida más fácil.

Pro: le brinda más flexibilidad en la estructura de archivos.

Con: En general, “ninguno”, aparte de los errores ocasionales de @import en navegadores muy antiguos.