答案是使用JavaScript动态加载、media属性延迟、预加载插入可异步加载CSS。通过动态创建link标签、设置非匹配media类型后切换、或preload预加载再转为stylesheet，可避免阻塞渲染，提升首屏速度，适用于非关键CSS，关键样式仍应同步加载。
在HTML中异步加载多个CSS文件，是为了避免阻塞页面渲染，提升首屏加载速度。虽然CSS默认是渲染阻塞资源，但可以通过一些技巧实现“异步”加载，即先加载而不立即应用，或动态插入。
1. 使用JavaScript动态创建link标签
这是最常用的方法：通过JavaScript创建标签并设置rel="stylesheet"，延迟插入到页面中，从而实现异步加载。
示例：同时加载多个CSS文件
这种方式不会阻塞DOM解析，CSS会在后台加载，加载完成后自动应用。
立即学习“前端免费学习笔记（深入）”；
2. 利用media属性延迟非关键CSS
将非关键CSS的media设为一个不匹配当前环境的值（如print），然后切换为all，触发加载。
情感家园企业站5.0 多语言多风格版
下载
一套面向小企业用户的企业网站程序！功能简单，操作简单。实现了小企业网站的很多实用的功能，如文章新闻模块、图片展示、产品列表以及小型的下载功能，还同时增加了邮件订阅等相应模块。公告，友情链接等这些通用功能本程序也同样都集成了！同时本程序引入了模块功能，只要在系统默认模板上创建模块，可以在任何一个语言环境（或任意风格）的适当位置进行使用！
也可以配合JavaScript批量处理：
3. 预加载 + 动态插入（推荐）
使用rel="preload"提前下载CSS，但不应用，等需要时再插入。
或者用JavaScript控制：
function preloadCSS(href) {
var link = document.createElement('link');
link.rel = 'preload';
link.as = 'style';
link.href = href;
link.onload = function() {
var sheet = document.createElement('link');
sheet.rel = 'stylesheet';
sheet.href = href;
document.head.appendChild(sheet);
};
document.head.appendChild(link);
}
preloadCSS('/css/one.css');
preloadCSS('/css/two.css');
基本上就这些方法。关键是不让CSS一开始就阻塞渲染，而是通过脚本控制加载时机。适合用于主题、组件库、非首屏样式等场景。注意：关键CSS仍建议内联或同步加载以保证视觉一致性。
