Markdown中<style>标签在预览时失效，因GitHub、Typora默认模式、VS Code等主流渲染器主动剥离该“危险标签”，不解析也不生效；可靠方案是用class配合外部CSS注入。
Markdown预览里写
不是你语法错了，是几乎所有主流 Markdown 渲染器（GitHub、Typora 默认模式、VS Code 官方预览、Obsidian 默认设置）会主动剥离 <style> 标签。它被当作“潜在危险 HTML”过滤掉，连解析都不触发。哪怕你把它放在文档开头、结尾，或者用 !important，结果都一样：DevTools 里看不到这条规则。
真正起作用的只有 class + 外部 CSS 注入
可靠路径只有一条：在 Markdown 里写带 class 的 HTML 元素，把样式逻辑交给宿主环境控制。
- Typora：设置 → 外观 → 打开样式文件夹 → 编辑
base.user.css，写如.highlight-box { background: #fffbcc; padding: 8px; } - Obsidian：设置 → 外观 → CSS 代码片段 → 新建文件，粘贴同上规则
- 自建网页（如用 marked 渲染）：确保渲染容器父级已加载外部 CSS，且类名匹配
注意：class 名必须和外部 CSS 文件里的选择器完全一致，大小写敏感，不能有空格或特殊字符。
<link rel="stylesheet"> 在 Markdown 文件里也无效
直接在 Markdown 源码里写 <link rel="stylesheet" href="custom.css"> 是徒劳的——它会被解析器忽略或当作普通文本渲染出来。因为 Markdown 不是 HTML 入口，它只是中间格式；<link> 必须出现在最终生成的 HTML 文档的 <head> 中，而这个 <head> 由渲染器控制，你无法从 .md 源文件里注入。
使用 markitdown 将文档和文件转换为 Markdown。适用于转换 PDF、Word (.docx)、PowerPoint (.pptx)、Excel (.xlsx, .xls)、HTML、CSV、JSON、XML 等格式。
立即学习“前端免费学习笔记（深入）”；
常见错误现象：
- 浏览器控制台报 404：说明路径对了但文件没被加载，根本原因是
<link>被丢弃了 - 样式偶尔“看起来”生效：大概率是你在 Typora 里开了「启用 HTML」+ 自定义主题，或用了 Electron 封装的私有渲染器——这不具通用性
为什么别赌 @import 或内联 style 属性
@import 是 CSS 规则，不是 HTML 加载机制。它只能写在 <style> 块顶部或 .css 文件里，且强制串行加载，极易引发 FOUC（无样式内容闪现）。而 style 属性只适合单点动态覆盖，比如 <div style="color: red">，它不支持媒体查询、无法复用、改一次就得遍历所有标签。
真正影响稳定性的，从来不是“怎么写”，而是“谁来加载、何时加载、作用域在哪”。把样式逻辑塞进 Markdown 源文件，等于把钥匙焊死在门锁外面——门打不开，不是钥匙坏了，是压根没插对地方。
