meta http-equiv=default-style作用及与link rel=stylesheet的选型问题

这个属性本身不具备加载样式资源的能力，不少开发者误以为这个meta可以直接引入默认样式资源，实际上它本身不包含任何资源地址、不会发起任何网络请求，只是HTML标准中原生多样式表机制的配套纯标记位，核心作用是为浏览器明确文档加载时的默认首选样式表集。
它的生效逻辑完全依赖页面中提前声明的带title属性的样式表：

• 你在content属性中填写的内容，必须和某一个样式表标签的title值完全匹配
• 匹配成功后，浏览器首次渲染页面时会默认激活对应样式表的规则，其他带alternate标识的备选样式表默认处于禁用状态
• 如果没有匹配的样式表，这个meta就是完全无效的冗余配置，不会带来任何页面效果变化

简单的生效示例代码：

<!-- 两套带标识的可选样式表 -->
<link rel="stylesheet" href="./light.css" title="light">
<link rel="alternate stylesheet" href="./dark.css" title="dark">
<!-- 声明默认激活title为light的样式表 -->
<meta http-equiv="default-style" content="light">

明确结论：两者不存在替代关系，绝大多数场景下完全没必要优先使用，更不能替代link标签引入样式的常规方案
具体原因拆解：

• 本质定位完全不同：link rel="stylesheet"是实际发起外部样式资源请求、把样式规则应用到页面的核心标签，没有这个标签完成资源加载，哪怕写了default-style的meta，页面也拿不到任何样式内容，会直接出现全页样式失效的问题
• 单样式场景下毫无价值：如果你的页面只需要引入一套普通业务样式，不带多主题切换需求，那么所有不带title属性的link样式表本来就会被浏览器默认加载，完全不需要额外加这个meta做声明，加了只会增加冗余代码
• 仅适配极小众场景：这个meta的适用范围非常窄，只在需要实现无JS原生多主题切换的场景下有作用——也就是靠浏览器自带的原生样式表选择能力（部分老版本浏览器会提供对应的样式表切换入口）实现不同主题切换时，才需要用这个meta指定首次加载的默认主题，避免浏览器在多套带title的样式表里随机选择默认激活项
• 当前主流开发实践中，多主题能力基本都是通过CSS变量、JS动态切换类名、按需动态加载样式文件实现的，原生的alternate stylesheet机制本身使用频率就极低，对应的default-stylemeta也就进一步失去了使用必要性

内容的提问来源于stack exchange，提问作者user11484628